在 jQuery 和 Ajax 中创建动态多选双列表框

问题描述

我将此 documentation 用于多选数据列表，实际上，我正在尝试动态制作此数据列表。我想在 <option> #duallist 事件的 #option_name 中附加和删除 change()。 我可以附加选项，但是当我单击单个选项标签时，所有选项标签都会移动到另一个框。 我无法删除/清空并重置数据列表。 我了解我所做的文档，但它不起作用。

我通过支持的代码附加了 JSON 格式的选项。

这是我的 JsFiddle 请帮助我如何动态制作我的数据列表。

$('select#duallist').bootstrapDualListBox();

$("select#option_name").change(function() {
  var value = $(this).val();

  $('select#duallist').bootstrapDualListBox('refresh',true); //remove all the prevIoUs data
  $.ajax({
    type: "POST",url: "./url.PHP",data: {
      value: value,type: "fetch_data"
    },dataType: 'JSON',cache: false,success: function(response) {
      var len = response.length;

      for (var i = 0; i < len; i++) {
        var id = response[i]['id'];
        var data = response[i]['data'];

        $("select#duallist").append("<option value='" + id + "'>" + data + "</option>");
      }
    },});
});

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）