回发后未保留 Select2 多选值答案

【问题标题】：Select2 multiselected values not being retained after postback回发后未保留 Select2 多选值
【发布时间】：2014-01-22 16:34:40
【问题描述】：

我遇到了一个问题，即单击提交或页面回发时未显示 select2 值。我正在使用 ajax 助手从数据库加载数据。

这是我的 select2 代码：

$('#<%=fstName.ClientID%>').select2({
        placeholder: 'Enter Reviewer',
        minimumInputLength: 0,
        multiple: true,
        autoClear:false,  
        ajax: {
            type: 'POST',
            url: 'BulkPickers/GetRev',
            dataType: 'json',

            data:
            function (term, page) {
                return {
                    appinstid: appInstId,
                    searchTerm: term,
                    selection: $('#<%=fstName.ClientID%>').val() 
                };
            },
            results: function (data, page) {

                var myResults = [];
                $.each(data, function (index, item) {
                    myResults.push({
                        id: item.id,
                        text: item.text
                    });
                });

                return {
                    results: myResults
                };
            },
            initSelection:
               function (element, callback) {
                   var data = [];
                   $(element.val().split(",")).each(function () {
                       data.push({ id: this, text: this });
                   });
                   callback(data);
               }
        }
    });

【问题讨论】：

标签： asp.net jquery-select2

【解决方案1】：

我找到了解决方案。需要在文本更改时填充隐藏字段值，然后使用 select2 上的隐藏输入值进行初始化。完整代码如下：

$j('#<%=txtVendor.ClientID%>').select2({

        placeholder: 'type the name ',
        minimumInputLength: 0,
        multiple: true,
        autoClear:false,  
        ajax: {
            type: 'POST',
            url: 'BulkPickers/GetVendor',
            dataType: 'json',

            data:
            function (term, page) {
                return {
                    appinstid: appInstId,
                    searchTerm: term,
                    selection: $j('#<%=txtVendor.ClientID%>').val() 
                };
            },
            results: function (data, page) {

                var myResults = [];
                $j.each(data, function (index, item) {
                    myResults.push({
                        id: item.id,
                        text: item.text
                    });
                });

                return {
                    results: myResults
                };
            }
        }
    }).select2("data",vendobj);

    $j('#<%=txtVendor.ClientID%>').change(function () {
        var selections = (JSON.stringify($j('#<%=txtVendor.ClientID%>').select2('data')));
        $j('#<%=hdnVend.ClientID%>').attr("value", selections);
    });

【讨论】：

【解决方案2】：

我相信这可能是由于您在回发期间没有重新填充 SELECT 中的项目（当您使用 AJAX 填充它们时，它们不是您的模型的一部分。）因此您试图设置SELECT 到不存在的 OPTION 的 id。

我有描述的问题，并使用我的模型中引用的项目填充 SELECT 已被选中，这意味着该值在回发后自动保留在 SELECT 中。不需要“手动”设置值。 OPTION 必须在 SELECT 中才能显示。

【讨论】：