jQuery Chosen 插件在引导模式上动态添加选项答案

【问题标题】：jQuery Chosen plugin add options dynamically on bootstrap modaljQuery Chosen 插件在引导模式上动态添加选项
【发布时间】：2014-03-28 09:43:16
【问题描述】：

我一直在尝试各种方法从 ajax 动态添加但无济于事。

我试过了：

$(function(){
//var htmlstring="";
$('#createNewTags').tokenfield();
$('#myModal').on('shown.bs.modal', function () {
    //var htmlstring="";
      $('.chzn-select', this).load("/availableTags.do", function(response, status, xhr ){
          var htmlstring="";
          if(status == "success"){
              var arrayVal = $.parseJSON(response.substring(response.indexOf("["), response.indexOf("}")));
              //var htmlstring="";
              $.each(arrayVal, function( index, value ) {
                  htmlstring +="<option value="+value+">"+value+"<option>\n";
              });

          }

      });
      $('.chzn-select', this).chosen();

});

我的 htmlstring 确实填充了我想要的内容，即

<option value="tagvalue">tagvalue</option>
<option value="tagvalue2">tagvalue2</option>
<option value="tagvalue3">tagvalue3</option>
<option value="tagvalue4">tagvalue4</option>

但我不知道如何添加这个 htmlstring 来阅读。我的 jsp 页面上有“选择”，但附加不起作用。知道我应该如何从这里继续吗？提取数据没有问题。

【问题讨论】：

标签： jquery ajax twitter-bootstrap modal-dialog jquery-chosen

【解决方案1】：

试试这个

$('.chzn-select').append("<option value='"+value+"'>"+value+"</option>");
$('.chzn-select').chosen().trigger("chosen:updated");

【讨论】：

【解决方案2】：

无需使用 html 字符串。只需在循环中附加您的 select 即可。最后你需要更新chosen()元素。

$(function(){
$('#createNewTags').tokenfield();
$('#myModal').on('shown.bs.modal', function () {
    //var htmlstring="";
      $('.chzn-select', this).load("/availableTags.do", function(response, status, xhr ){
          var htmlstring="";
          if(status == "success"){
              var arrayVal = $.parseJSON(response.substring(response.indexOf("["), response.indexOf("}")));
              //var htmlstring="";
              $.each(arrayVal, function( index, value ) {
                  $("select").append("<option value="+value+">"+value+"<option>");
              });

          }

      });
      $('.chzn-select', this).chosen().trigger("chosen:updated");

});

查看Chosen documentation 并查找动态更新选择

【讨论】：