javascript - 当我使用 data-rel ="chosen"json ajax 数据未与下拉列表绑定(bind)时

Question

我的 Ajax 函数

$.ajax({

        type: "POST",
        contentType: 'application/json;charset=utf-8',
        dataType:'json',
        url: 'getSites',
        data: JSON.stringify(),
        success: function(json)
        {//alert("success")
             $.each(json,function(i,obj)
                        {
                        // alert(obj.value+":"+obj.text);
                        var div_data="<option value="+obj[0]+">"+obj[1]+"</option>";
                        //alert(div_data);
                        $(div_data).appendTo('#work_site'); 
                        });

        }


    });

和我的下拉列表

<select  name="priority" required="required" data-rel="chosen"  id="work_site">
                                    <option value="">--Select--</option>

                                  </select>

如果我从选择选项中删除“data-rel="chosen"，它应该可以完美地工作。我真的想显示一个可搜索的下拉列表。我应该怎么做？

http://jsfiddle.net/sCyYn/2/这是我真正想要的来 self 的 ajax 函数的动态内容。

Answer 1

正在将选项添加到 <select>元素 after 所选对象被实例化。所选对象不知道添加了新选项，所以你必须告诉它。您可以使用 .trigger("chosen:updated"); 来做到这一点

var div_data = "";
$.each(json,function(i,obj) {
    div_data += "<option value="+obj[0]+">"+obj[1]+"</option>";
});

var $work_site = $('#work_site');
$(div_data).appendTo($work_site); 
$work_site.trigger("chosen:updated");