select2 和 ajax的坑

select2，一款帶多選功能，樣式更加好看的select插件。

---

下方記錄坑，前方高能.

---

• 要用ajax發請求而且爲select2賦初始值

  $.ajax({

  url : _ctx+"/basInfo/listPsinfoData",
                             data : "page=1&rows=9999&flag=1",
                             type : "post",
                             async : false,
                             success : function(msg) {
                                 $("#" + PreSeleltName + "PSCODES").empty();
                                 var pscodeList = [];
                                 var pscodeString = "";
                                 var tempList = [];
                                 var data = msg.rows;
                                 for ( var i in data) {
                                     var temp = data[i];
                                     var tempPscode = temp.PSCODE;
                                     var tempPsname = temp.PSNAME;
                                     if(tempPscode && tempPsname){
                                         tempList.push({id :temp.PSCODE,text :temp.PSNAME});
                                     }
                                 }
                                 //初始化select2 企業 而且 賦值到vmData.data.PSCODELIST
                                 $("#" + PreSeleltName + "PSCODES").select2({
                                     data:tempList,
                                     placeholder:'選擇或搜索企業',//默認文字提示
                                     multiple: true,//多選
                                     allowClear: true
                                 }).change(function(){
                                     pscodeList = $("#" + PreSeleltName + "PSCODES").val();
                                     for(var i in pscodeList){
                                         var pscode = pscodeList[i];
                                         if(i == 0){
                                             pscodeString = pscode;
                                         }else{
                                             pscodeString = pscodeString + ","+ pscode;
                                         }
                                     }
                                     Vue.set(vmData.data, 'PSCODELIST', pscodeString);
                                 });
                             },
                         });

  這樣select2下拉列表就有了對應的值

真有這麼簡單???下方記錄大坑！！

• 不要同時發ajax請求，可能引發衝突
• 在ajax結構體裏發請求，好比編輯功能，獲取具體的值爲select2賦初始值，注意給select2初始化設置延遲加載
• select2裏要賦值初始化選中又要賦值初始化列表，須要先作具體的賦值，後面再調用一次select2初始化一次而且加延遲加載。