선택 2 및 원격 데이터 : 미리 설정된 값과 텍스트 내 HTML 태그 서버 측 (asp.net의 mvc4)를 생성하고 서버 왕복

Question

을 피하는. 내가 좋아하는 것
은 값과 initSelection 함수에서 데이터를 가져 오기 위해 AJAX 호출을 피하는 내 숨겨진 필드에 대한 설명을 미리 정한합니다.

내가 자바 스크립트를 사용하여 값을 설정 사람을 본 적이 :

$("#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이 호출되는 것을 보았다.
모든 것이 제대로 작동하는 것 같습니다.

더 좋은 방법이 있습니까?

Answer 1

data-option을 맞춤형으로 결합하여 트릭을 만들었습니다. 내가 만든 관심이있는 사람들을위한

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

당신은 내가 선택 2에게 모든 기능을 태그를 생성하는 HTML 도우미를 추가 한 어떤에서 ASP.NET MVC4 프로젝트를 찾을 수 있습니다 어디 GitHub repository 클라이언트 측 유효성 검사를위한