select 2 ajax標準値、初期値の設定方法


機能を行うにはデータの修正が必要です。データを修正するには元の値を表示する必要があります。
しかし、select 2では、元の値を示すのは非常に大変です。
3時間検討したが、最後に$ajaxを使って元の値を再読み込みし、表示した。

 //two AJAX      (    )
 var $c_HospitalCode = $("#c_HospitalCode").select2({
 ajax: {
  type: 'GET',
  url: "/Report/AjaxOption/Ajax_LoadHospitalByKey",
  dataType: 'json',
  delay: 400,
  data: function (params) {
   return {
    key: params.term, // search term     
    page: params.page,
    MKORGCode: '@VModel.MKORGCode'
   };
  },
  processResults: function (data, params) {
   //      
   for (var i = 0; i < data.length; i++)
   {
    data[i].id = data[i].Value;
    data[i].text = data[i].Name;
   }
   //params.page = params.page || 1;
   return {
    results: data//,//itemList
    //pagination: {
    // more: (params.page * 30) < data.length
    //}
   };
  },
  cache: true
 },

 placeholder: '   ',//      
 //placeholder: { id: "2", text: "text2" },
 language: "zh-CN",
 tags: true,//      
 separator: ",", //    
 allowClear: true,//    
 escapeMarkup: function (markup) { return markup; }, //         xss  
 minimumInputLength: 3,//              
 formatResult: function formatRepo(repo) { return repo.text; }, //         
 formatSelection: function formatRepoSelection(repo) { return repo.text; }//, //             
 });
ポイントは下記のコードです。標準値を再読み込みします。

 //       .   . 
  $.ajax({
   url: "/Report/AjaxOption/Ajax_LoadHospitalByHospitalCodes", 
   data: { HospitalCodes: '@VModel.HospitalCode' },
   dataType:'json',
   success: function (data) { 
    for (var d = 0; d < data.length; d++) {
     var item = data[d]; 
     var option = new Option(item.Name, item.Value, true, true); 
     $c_HospitalCode.append(option);
    }

    $c_HospitalCode.trigger('change');//         select2 .
   } 
  }); 
主にselectコントロールにoptionを追加します。具体的にはajaxがロードしますか?それとも直接バックグラウンドがコードで生成されますか?全部できます。最後に$select.2.triggerを使います。画面に描画します。
以上のselect 2 ajaxは標準値を設定していますが、初期値の方法は小編集が皆さんに提供した内容を全部共有しています。