Select2 Предварительная загрузка нескольких выборок из цикла AJAX

Question

Я интегрирую API карт Google, который использует Geonames и Select2, чтобы пользователь мог войти в города, которые он посетил.

В настоящее время я пытаюсь найти способ для области поиска, чтобы показать выбор, сделанный пользователем в предыдущем сеансе после перезагрузки страницы (например, если пользователь уже вошел в Париж, Франция на предыдущей сессии, затем в Париж , Франция должна быть предварительно загружена в зону поиска после перезагрузки). Выбор хранится в базе данных, но на данный момент я могу только поместить один из ранее выбранных городов в область поиска, перенаправляя его через Geonames (мне нужно пройти через Geonames, чтобы пройти lat &). Я хотел бы повторно разместить столько мест, сколько пользователь вступил в предыдущий сеанс.

код я использую для этого ниже - спасибо за вашу помощь:

function locationFormatResult(location) { 
return location.name + ", " + location.adminName1 + ", " + location.countryName; 
}//results format 

function locationFormatSelection(location) { 
    return location.name + ", " + location.adminName1 + ", " + location.countryName; 
}//selection format 


$(function() { 
    $('#citiestext').select2({ 
     id: function(e) { return e.name + ',' + e.adminName1 + ',' + e.countryName + ',' + e.lat + ',' + e.lng}, 
     placeholder: 'Location', 
     multiple: true, 
     allowClear: true, 
     width: '350px', 
     height: '50px', 
     overflow: 'auto', 
     minimumInputLength: 2, 
     ajax: { //this is the ajax call for when the user selects a city 
      url: 'http://ws.geonames.org/searchJSON', 
      dataType: 'jsonp', 
      data: function (term) { 
       return { 
        featureClass: "P", 
        style: "medium", 
        isNameRequired: "true", 
        q: term 
       }; 
      }, 
      results: function (data) { 
       return { 
        results: data.geonames 
       }; 
      } 
     }, 
     initSelection : function(element, callback){ 
     for (var i=11;i<13;i++){ 
      $.ajax("http://ws.geonames.org/searchJSON",{//ajax for preloading 
       dataType: 'jsonp', 
       data:{ 
       maxRows:1, 
       q: i}//for this example, I'm using the numbers 11 & 12 as my Geonames queries just to test the preloading functionality (both numbers do have corresponding locations in Geonames if run through a query) 
      }).done(function(data){callback(data.geonames);}); //PROBLEM: currently is only returning the location for "12" - I need it to return locations for 11 and 12 in the select area   
     }}, 
     formatResult: locationFormatResult, 
     formatSelection: locationFormatSelection, 
     dropdownCssClass: "bigdrop", 
     escapeMarkup: function (m) { return m; } 
    }); 
}); 

jsfiddle: http://jsfiddle.net/YDJee/ (пытаясь получить больше, чем одну запись в поле выбора)

Answer 1

Дело в том, что обратный вызов нужно вызвать с массивом объектов для нескольких select2.

В этом случае, поскольку вам нужно собрать каждый json-объект из вызова ajax, вам нужно использовать отложенные jQuery.

Нечто подобное:

initSelection : function(element, callback){ 
     var result = new Array(); 
     var f = function(i) { 
        return $.ajax("http://ws.geonames.org/searchJSON",{ 
          dataType: 'jsonp', 
          data:{ 
           maxRows:1, 
           q: i 
          }, 
          success: function(data) { result.push(data);}}) 
     }; 
     var def = []; 
     for (var i=11;i<13;i++){ 
      def.push(f(i)) 
     }}; 
     $.when.apply($, def).done(function() { 
      callback(result); 
     }); 
} 

Answer 2

Для тех, кто также использует id обратный вызов, и кто находит их вопрос не является проблемой асинхронной, посмотрите на this (который остается необходимым исправить как в этой публикации) ,