Javascript Select2 initSelection预加载的数据不显示

我使用select2将远程数据加载到select中，输入标记有一个预加载的值属性，该属性指向一个预选选项，当我加载页面时，它会显示select，右侧有清除选项x，但数据不会显示

这是我的代码：

    function FormatResult(Consig) {
    return Consig.NomCon;
}

function FormatSelection(Consig) {
    $('#strConNom').val(Consig.NomCon);
    return Consig.NomCon;
}

$("#strCon").select2({
placeholder: "Search",
minimumInputLength: 5,
allowClear: true,
ajax: {
    url: "LoadData.asp",
    dataType: 'jsonp',
    data: function (term, page) {
        return {
            q: term,
            CodCas: $('#strCas').val(),
        };
    },
    results: function (data, page) {
        return {results: data.ConsigNom};
    }
},
initSelection: function(element, callback) {
    var id=$(element).val();
    if (id!=="") {
        $.ajax("LoadData.asp", {
        dataType: 'jsonp',
            data: {
                CodCon: id,
                CodCas: $('#strCas').val(),
            },

        }).done(function(data) { 
        callback(data);
        });
    }
},
formatResult: FormatResult,
formatSelection: FormatSelection,
dropdownCssClass: "bigdrop",
escapeMarkup: function (m) { return m; }
});

---

如何解决这个问题？

我遇到了一个类似的问题，我通过在输入元素的html中包含一个value属性以及适当的formatSelection和initSelection解决了这个问题

传递到select2的json有两个字段id和文本

以下是我的js代码：

$( "#contributorNameSearchId" ).select2({
        placeholder: "Select a contributor",
        containerCssClass: "dropDown",
        minimumInputLength: 3,
        ajax: { 
            url: "getList?t=contributor",
            dataType: 'json',
            data: function (term, page) {
                return {
                    term: term, // search term
                    page_limit: 10,
                };
            },
            results: function (data, page) { 
                return {results: data};
            }
        },
        allowClear: true,
         formatSelection: function(data) { 
            return data.text; 
        },
        initSelection : function (element, callback) {
            var obj= {id:1,text:'whatever value'};
            callback(obj);
        } 
    }); 

以及输入元素本身：

<input value="0000" name="contributorNameSearch" id="contributorNameSearchId"/>

需要一个data.something，尽管您的格式选择似乎还可以。检查从LoadData.asp返回的数据

---

我希望这会有所帮助。

确保在initSelection函数中，LoadData.asp传递单个对象，而不是包含单个对象的数组

错：

[{"id": 5, "text":"myValue"}]

正确：

{"id": 5, "text":"myValue"}

这是你修改过的函数

initSelection: function(element, callback) {
    var id=$(element).val();
    if (id!=="") {
        $.ajax("LoadData.asp", {
        dataType: 'jsonp',
            data: {
                CodCon: id,
                CodCas: $('#strCas').val(),
            },

        }).done(function(data) { 
            callback(data[0]);
        });
    }
},

---

对我来说，我必须从初始设置中删除PlaceHolder选项-当select2加载完成时，可能对其他人有用，请编写以下代码

$(".ajax_select").select2("data", {"id": 5, "text": "Test"});

---

它将设置select2的默认选择。

经过一番努力后，解决方案如下

注意，数据对象的键应与您的repormatselection相同 var data={id:1，cardname:discreate}

您将在所有答案中看到文本，但它应该与json变量相同

还有一件更重要的事，确保在select2隐藏输入中输入value=0或一些伪值

---

万分感谢！我在行与行之间读取数据，并且没有输入虚拟值。在我的例子中，我有多个select2，具有相同的initSelection:you mean.select2val，{id:5，text:Test}用于预加载值的使用。select2val，5；但对于动态数据，请使用上述代码。这难道不是select用户的唯一选择吗？对于动态数据，我会使用完整的选项值数组来处理数据，使用单个值来设置默认值：$.ajx_select.select2{data:[…]}.select2'val'，{…}

$(".ajax_select").select2("data", {"id": 5, "text": "Test"});

$("#myselect").select2({
    allowClear: true,
    placeholder: "Search for a card",
    minimumInputLength: 3,
    ajax: {
            url: "search.php",
            dataType: 'json',
            quietMillis: 250,
            data: function (term, page) {
              return {
                 q: term, // search term
            };
        },
        results: function (data, page) { 
            return {results: data.items};
        },
        cache: true
    },
    initSelection: function (element, callback) {              
        var data = {id: 1, cardname: "Abolish"};
        callback(data);
    },
    formatResult: repoFormatResult,  
    formatSelection: repoFormatSelection, 
    escapeMarkup: function (m) {
        return m;
    } // we do not want to escape markup since we are displaying html in results
});

    function repoFormatResult(card) {
        var markup = '<div class="row-fluid">';

        if (card.cardimage != '')
        {
           markup += '<div class="span2" style="float:left; margin-right:10px"><a class="qtooltip" href="#" rel="' + card.cardimage + '" ><img src="' + card.cardimage + '" width="50px" /></a></div>';
        }

        markup += '<strong>' + card.cardname + '</strong> <small>' + card.editionname + '</small>'
        markup += '<div style="clear:both;"></div></div>';

        return markup;
    }

    function repoFormatSelection(card) {
        return card.cardname;
    }