sử dụng đúng cách initSelection callback jQuery Select2 với dữ liệu từ xa

Question

tôi sử dụng jQuery Select2 plugin để lấy postcodes bằng cách sử dụng chức năng gọi lại ajax quy định như sau:

$(document).ready(function() { 
    $("#postcodes").select2({ 
     placeholder : "Search for a postcode", 
     multiple : true, 
     minimumInputLength : 3, 
     ajax : { 
      url : "/bignibou/utils/findGeolocationPostcodeByPostcodeStartingWith.json", 
      dataType : 'json', 
      data : function(term) { 
       return { 
        postcode : term 
       }; 
      }, 
      results : function(data) { 
       console.log(data); 
       return { 
        results : $.map(data, function(item) { 
         return { 
          id : item.id, 
          text : item.postcode 
         }; 
        }) 
       }; 
      } 
     } 
    }); 
}); 

Khi hai postcodes được lựa chọn tôi nhận được kết quả hidden input trong DOM:

<input type="hidden" class="bigdrop select2-offscreen" id="postcodes" style="width:600px" name="familyAdvertisement.postcodes" value="4797,4798" tabindex="-1"> 

vấn đề tôi có là một khi các mẫu được hiển thị lại (ví dụ trong trường hợp của một số điều khiển khác là do lỗi), các lựa chọn (tức là hai postcodes và đặc biệt là text) d không hiển thị trong biểu mẫu mặc dù hidden input không có hai giá trị (tức là 4797 và 4798, là số id s cho mã bưu điện).

Tôi không chắc liệu tôi có phải thực hiện một chuyến đi khứ hồi ajax khác khi biểu mẫu được hiển thị lại hay không hoặc có cách nào tốt hơn không.

Mọi người có thể vui lòng cho biết không?

Answer 1

Các initSelection phương pháp có để vượt qua các giá trị trong đó có có mặt trong select2

Ex:

$("#postcodes").select2({ 
    placeholder : "Search for a postcode", 
    multiple : true, 
    minimumInputLength : 1, 
    data:[], 
    initSelection : function (element, callback) { 
     var data = [{id:1,text:'bug'},{id:2,text:'duplicate'}]; 
     callback(data); 
    } 
}).select2('val', ['1', '2']); 

Demo: Fiddle