Question

我在使用一些JSON数据填充下拉列表时遇到了一些麻烦，我怀疑是因为我在#stuff div中附加$ .post的方式而发生错误，但我已经尝试了几种方法只是不会得到它的悬念。

select id =“”tag＆amp; div位于另一个视图中（它不是这个特定文档的一部分），是否存在以这种方式填充下拉列表的问题？

我试图提醒“listItems”并且我已经获得了选项值等...不要理解为什么它不会填充。

任何帮助将不胜感激。

来自$ .post =

的Json响应

{"childrendata":[{"id":"42","parent":"1","fName":"hej","lName":"nisse","birthdate":"2011-10-21"}]}

jQuery / js：

 $("#stuff").append(function(){


                $.post("show_relations", {},
                            function(data)
                            {
                            $("#stuff").empty();

                            json = eval('('+data+')');

                                if(data == '{"childrendata":[]}')
                                {
                                    $("#stuff").append("No relations registered.");
                                }
                                else
                                {
                                  var listItems= "";

                                      for (var i = 0; i < json.childrendata.length; i++)
                                      {
                                        listItems+= "<option value='" + json.childrendata[i].fName + "'>" + json.childrendata[i].lName + "</option>";
                                      }

                                    $("#child_list").html(listItems);
                                }
                            });
            });
    });

Answer 1

编辑：根据您的评论，我会假设您的问题纯粹是单页。

该代码的问题似乎是您尝试将.append()与函数（有效的jQuery）一起使用，但该函数不返回jQuery可以追加的任何内容'东西'节点; $.post进行Ajax调用，立即返回。

相反，请尝试以下内容（根据需要修改Ajax调用的URL）：

$.post("url/to/post/to", {},
    function(data) {
        $("#stuff").empty(); //Clear your stuff div

        var children = data.childrendata; //jQuery automatically unserializes json

        if(children.length == 0) {
            $("#stuff").append("No relations registered.");
        }
        else {
            $('#stuff').append('<select id="child_list"></select>');
            $.each(children, 
                function(index, value) {
                    //Append each option to the selectbox
                    $("#child_list").append("<option value='" + value.fName + "'>" + value.lName + "</option>");
                }
            );
        }
    },
    'json'
);

$。each（）是通用的jQuery迭代器，它有助于解码代码。

这样做是为所提供的URL发布一个Ajax帖子，该URL响应序列化的json对象。回调接受该响应（jQuery已经单独反序列化），向'#stuff'div添加一个新选择，然后将动态创建的选项添加到新选择。

尾注：我很抱歉没有发布$ .each文档的链接，StackOverflow只允许我在一个帖子中发布2个超链接。

使用2个视图/文档填充包含JSON数据的下拉列表

1 个答案: