2012-09-12 4 views
6

Javascript, jQuery, Ajax ve jSON dünyasında yeniyim.Mix2 Seçme2 Uzak Verileri Yer Tutucularla Yükleme açılır

Ne yapmak gerek Select2 ile mevcut 2 seçenek

tutucular

$("#e2_2").select2({ 
    placeholder: "Select a State" 
}); 

ve Uzaktan

Yükleme karıştırmak için veriler, görebileceğiniz gibi

$("#e6").select2({ 
    placeholder: "Search for a movie", 
    minimumInputLength: 1, 
    ajax: { // instead of writing the function to execute the request we use Select2's convenient helper 
     url: "http://api.rottentomatoes.com/api/public/v1.0/movies.json", 
     dataType: 'jsonp', 
     data: function (term, page) { 
      return { 
       q: term, // search term 
       page_limit: 10, 
       apikey: "ju6z9mjyajq2djue3gbvv26t" // please do not use so this example keeps working 
      }; 
     }, 
     results: function (data, page) { // parse the results into the format expected by Select2. 
      // since we are using custom formatting functions we do not need to alter remote JSON data 
      return { 
       results: data.movies 
      }; 
     } 
    }, 
    formatResult: movieFormatResult, // omitted for brevity, see the source of this page 
    formatSelection: movieFormatSelection, // omitted for brevity, see the source of this page 
    dropdownCssClass: "bigdrop" // apply css that makes the dropdown taller 
}); 

olduğunu Web sitesi seç, bu seçenekler oldukça farklı. Yüklenen Uzak Verileri Yüklemeyi tıkladığımda, bir arama seçeneği açar. Ama ben bunu istemiyorum. Kullanılabilir seçenekler ile açılan listeyi aşağı kaydırmak istiyorum PlaceHolder örneği.

Yer tutucu örneğinde, açılır menüde bulunan seçenekler HTML'de kodlanmıştır. İhtiyacım olan şey, açtığınızda jSON dosyasına gider ve jsonda bulunan bilgileri döndürür.

İdeal, Yer Tutucu Select2'nin UI'sini, diğer Select2 örneğindeki Yükleme Uzaklaştırma Tarihi'nin işlevselliği (sunucuda json getirme) ile kullanmaktır.

Herhangi bir fikrin var mı? 2 birleştirilemezse süper hızlı Ajax çözümüne açığım. Yalnızca ajax sizin 2'yi Seç için (uzaktan API aracılığıyla gerek arama) verilerini yüklemek için gerekiyorsa

+0

Angularui'ye bakmaya değer olabilir: http://angular-ui.github.com/#directives-select2 – Tosh

cevap

1

Eğer bu şekilde yapabilirsiniz:

$.get("/path/to/your/data.json", function(data){window.ajaxData=data;}); 
$("#e2_2").select2({data: window.ajaxData, placeholder: "Select a State"}); 

(küresel değişkenleri kullanarak genellikle kötü bir uygulamadır, ancak bu sadece bir örnek)