Select2更改事件,而不删除已选择的选项

select2 change event without removing already selected options

本文关键字:删除 选择 选项 事件 Select2      更新时间:2023-09-26

我使用select2与多个选项和编程访问选择也与一个按钮。它工作得很好,但当我点击按钮所有以前选择的值被删除,只有从点击按钮的值被选中。因为我使用的是多重选择,这将是有意义的添加点击值,并留下之前选择的不删除它们…除了"更改"之外,是否还有另一个事件要触发,该事件不会删除值,而是添加值?

<select id="id_entities" class="js-example-programmatic" style="width:100%" multiple="multiple">
</select>
<td><button id="prefix_{{teu.entity_id}}" class="js-programmatic-set-val" value="{{teu.entity_id}}" name="{{teu.entity}}"><i class="fa fa-plus"></i></button></td>
<td>{{teu.entity}}</td>
<td>{{teu.user}}</td>
<script >
$(".js-example-programmatic").select2({
    minimumInputLength: 2,
    placeholder: "Select entities...",
    allowClear: true,
    multiple:true,
    delay: 250,
    tags:false,
    ajax: {
        url: '/entities/search/autocomplete/',
        dataType: 'json',
        data: function (parms, page) { return { title: parms.term }; },
    },
});
</script>
<script>
var $example = $('#id_entities');
$("button[id^='prefix_']").click(function(){
   value = $(this).attr('value');
   value_name = $(this).attr('name')
 if ($('#id_entities option[value="'+value+'"]').length > 0) {
 } 
  else { 
     $("#id_entities").append('<option value="'+value+'">'+value_name+'</option>');
  }
$example.val(value).trigger("change");
  });
</script>

好吧,在没有看到工作演示的情况下,我假设您想要的是将标签附加到select2上,而不删除已经存在的标签/多重选择?如果是这样,您需要计算元素的值,并附加新的值,而不是仅仅调用$example.val(value),它会替换所述元素

的值。
var data = $(test).select2('data');
data.push({id:5,text:"fixed"});
$(test).select2("data", data, true); // true means that select2 should be refreshed

类似于SELECT2 ->添加数据而不替换内容