格式化具有json的Select2下拉結果

Question

我正在使用select2下拉控件來顯示設施列表，例如設施A，B，C ...等。 以及其位置詳細信息。 我正在尋找以下輸出，

目前，我可以顯示“設施名稱”，但是想從我的json對象顯示城市和州。 如何格式化結果以將其顯示為以上html格式？ 到目前為止，這是我的代碼。

<input type="hidden" id="ddlFacility" style="width:100%" />

$("#ddlFacility").select2({
        placeholder: "Select a Facility",
        ajax: {
            url: "my url",
            dataType: 'json',
            type: "GET",
            quietMillis: 50,
            data: function ( term ) { return { term: term }; },
            results: function (data) {
                return {
                    results: $.map(data, function (item) {
                        return { text: item.FacilityName, id: item.FacilityId }
                    })
                };
            }
        }
    });

Answer 1

在您的select2選項中傳遞類似這樣的函數並設置類的樣式，但是您需要

...
placeholder: "Select a Facility",
    formatResult: function(item)
    { 
         return '<div class="facility">' + item.text + '</div><span class="city">' + item.city + '</span></div>';
    },
 ...

您可能需要您的.map函數，除了id和text之外還包括設施名稱和城市值。

如果希望所選值看起來相同，請對formatSelection選項使用相同的功能