select2和遠程數據：預設值和文本避免服務器往返

我正在生成我的HTML標記服務器端（asp.net mvc4）。
我想要預先設置我的HIDDEN字段的值和描述，避免使用ajax調用來獲取initSelection函數中的數據。select2和遠程數據：預設值和文本避免服務器往返

我見過有人設置使用JavaScript值：

$("#select2Test").select2('data', { id: 20832, text: 'LONDON' })

但它仍然需要我額外的代碼來實現的東西已經從服務器在一個視圖模型已經流。

我想出這樣的事情：

<input type="hidden" id="select2Test" name="select2Test" value="20832" data-option="LONDON" />

我已經使用了HTML5數據屬性data-option我查找的描述，我已經實現了initSelection函數，這樣我可以讀我場的價值和它的數據屬性：

initSelection: function (item, callback) { 
    var id = item.val(); 
    var text = item.data('option'); 
    var data = { id: id, text: text }; 
    callback(data); 
},

我見過initSelection被稱爲只有當隱藏字段設置了數值。
一切似乎正常工作。

有沒有更好的選擇？

來源

2013-05-16 LeftyX

你在做什麼回調？加載頁面時加載該數據不是更好嗎？ – Kenneth

@Kenneth：我已經更新了我的問題。那裏有完整的代碼。該頁面已被加載。我的控制器返回一個視圖和一個視圖模型與整個數據集。 – LeftyX

data-option結合自定義initSelection訣竅。

$("#lookup_id").select2({ 
     minimumInputLength: 3, 
     multiple: false, 
     allowClear: true, 
     ajax: { 
      url: urlFetchCity, 
      dataType: 'json', 
      type: "POST", 
      data: function (term, page) { return { city: term }; }, 
      results: function (data, page) { 
       return { 
        return {results: data}; 
       }; 
      } 
     }, 
     initSelection: function (item, callback) { 
      var id = item.val(); 
      var text = item.data('option'); 
      var data = { id: id, text: text }; 
      callback(data); 
     }, 
     formatResult: function (item) { return ('<div>' + item.id + ' - ' + item.text + '</div>'); }, 
     formatSelection: function (item) { return (item.text); }, 
     escapeMarkup: function (m) { return m; } 
    });

對於那些有興趣誰我已經創建了一個GitHub repository在那裏你可以找到一個ASP.NET MVC4項目中，我已經添加了一個HTML幫助創建一個選擇2標籤的所有功能用於客戶端驗證。

來源

2013-05-29 14:42:52 LeftyX

謝謝！就是我在找的東西。 –

不客氣。 – LeftyX

select2和遠程數據：預設值和文本避免服務器往返

回答

相關問題