Định dạng JSON cho jquery-select2 đa với ajax

Question

Tôi đang nghĩ đến việc chuyển từ Chosen sang Select2 vì Select2 có các phương thức gốc cho ajax. Ajax rất quan trọng vì thường bạn phải tải rất nhiều dữ liệu.

tôi thực hiện thành công ví dụ với JSON của api.rottentomatoes.com/api/

Tôi đã làm một tệp JSON để kiểm tra ajax, nhưng nó đã không hoạt động.

Tôi không biết JSON nên như thế nào. Dường như không có tài liệu chi tiết:

https://github.com/ivaynberg/select2/issues/920

tôi đã cố gắng unsucessfully một số định dạng JSON, vì vậy tôi cố gắng bắt chước một định dạng JSON tương tự như api.rottentomatoes nhưng nó không hoạt động.

Tôi có thể thiếu điều gì đó ngu ngốc.

function MultiAjaxAutoComplete(element, url) { 
    $(element).select2({ 
     placeholder: "Search for a movie", 
     minimumInputLength: 1, 
     multiple: true, 
     ajax: { 
      url: url, 
      dataType: 'jsonp', 
      data: function(term, page) { 

       return { 
        q: term, 
        page_limit: 10, 
        apikey: "z4vbb4bjmgsb7dy33kvux3ea" //my own apikey 
       }; 
      }, 
      results: function(data, page) { 
       return { 
        results: data.movies 
       }; 
      } 
     }, 
     formatResult: formatResult, 
     formatSelection: formatSelection, 
     /*initSelection: function(element, callback) { 
      var data = []; 
      $(element.val().split(",")).each(function(i) { 
       var item = this.split(':'); 
       data.push({ 
        id: item[0], 
        title: item[1] 
       }); 
      }); 
      //$(element).val(''); 
      callback(data); 
     }*/ 
    }); 
}; 

function formatResult(node) { 
    return '<div>' + node.id + '</div>'; 
}; 

function formatSelection(node) { 
    return node.id; 
}; 


/*MultiAjaxAutoComplete('#e6', 'http://api.rottentomatoes.com/api/public/v1.0/movies.json');*/ 

MultiAjaxAutoComplete('#e6', 'https://raw.github.com/katio/Quick-i18n/master/test.json'); 

$('#save').click(function() { 
    alert($('#e6').val()); 
}); 

tôi đã làm jsfiddle này:

http://jsfiddle.net/Katio/H9RZm/4/

Answer 1

Nếu bạn chuyển sang JSON chắc chắn rằng bạn chuyển datatype để JSON từ JSONP.

Định dạng được quy định ở đây: http://ivaynberg.github.io/select2/#doc-query

Các JSON sẽ trông như thế này:

{results: [choice1, choice2, ...], more: true/false } 

Về cơ bản các thuộc tính cần thiết chỉ trong việc lựa chọn là id. nếu tùy chọn chứa các tùy chọn con khác (chẳng hạn như trong trường hợp lựa chọn giống như nhóm chọn) thì các tùy chọn đó được chỉ định bên trong thuộc tính children.

Trình kết xuất lựa chọn và lựa chọn mặc định mong đợi thuộc tính text trong mọi lựa chọn - đó là những gì được sử dụng để hiển thị lựa chọn.

do đó, một ví dụ hoàn chỉnh của một quốc gia Mỹ sử dụng renderer mặc định có thể trông như thế này:

{ 
    "results": [ 
     { 
      "id": "CA", 
      "text": "California" 
     }, 
     { 
      "id": "CO", 
      "text": "Colarado" 
     } 
    ], 
    "more": false 
} 

Hy vọng điều này giúp bạn bắt đầu.

Answer 2

Tài liệu chính thức cho định dạng JSON bắt buộc: ref. https://select2.org/data-sources/formats

{ 
    "results": [ 
    { 
     "id": 1, 
     "text": "Option 1" 
    }, 
    { 
     "id": 2, 
     "text": "Option 2" 
    } 
    ], 
    "pagination": { 
    "more": true 
    } 
}