2013-05-16 6 views
5

Generuję moje znaczniki HTML po stronie serwera (asp.net mvc4).
Chciałbym wstępnie ustawić wartość i opis mojego pola HIDDEN unikając wywołania ajax, aby pobrać dane w funkcji initSelection.select2 i dane zdalne: wstępnie ustawiona wartość i tekst omijający serwer w obie strony

Widziałem kogoś ustawienie wartości przy użyciu javascript:

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

ale wymagałoby to mi dodatkowy kod, aby osiągnąć coś, co zostało już strumieniowo z serwera w viewmodel.

mam wymyślić coś takiego:

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

Użyłem przydzielać dane HTML5 data-option z opisem mojego odnośnika i zaimplementowaniu funkcji initSelection tak, że mogę przeczytać wartość moim polu i to atrybut danych:

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

widziałem że initSelection jest wywoływana tylko wtedy, gdy pole ukryte ma ustawioną wartość.
Wszystko wydaje się działać poprawnie.

Czy są jakieś lepsze opcje?

+0

Co robisz dokładnie w oddzwonieniu? Czy nie byłoby lepiej załadować te dane również po załadowaniu strony? – Kenneth

+0

@Kenneth: Zaktualizowałem moje pytanie. Tam jest pełny kod. Strona jest już załadowana. Mój kontroler zwraca widok i model widoku z całym zestawem danych. – LeftyX

Odpowiedz

14

data-option w połączeniu z niestandardowym initSelection załatwił sprawę.

$("#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; } 
    }); 

dla tych, którzy są zainteresowani Utworzyłem GitHub repository gdzie można znaleźć ASP.NET MVC4 projekt, w którym Dodałem takie pomocnika HTML Aby utworzyć select2 tagi z wszystkich funkcji do sprawdzania poprawności po stronie klienta.

+0

Dzięki! właśnie tego szukałem. –

+0

Nie ma za co. – LeftyX

Powiązane problemy