另一種方式來加載遠程數據在選擇二

我試圖獲得遠程使用JSON從一個PHP頁面，JSON數據：另一種方式來加載遠程數據在選擇二

[{"id":"0","name":"ABC"},{"id":"1","name":"DEF I"},{"id":"2","name":"GHI"}]

和腳本是這樣的：

$(document).ready(function() { 
    $('#test').select2({ 
     minimumInputLength: 1, 
     placeholder: 'Search', 
     ajax: { 
     dataType: "json", 
     url: "subject/data_json.php", 
     data: function (term, page) {// page is the one-based page number tracked by Select2 
      return { 
       college: "ABC", //search term 
       term: term 
      }; 
     }, 
     type: 'GET', 
      results: function (data) { 
       return {results: data}; 
      } 
     }, 
     formatResult: function(data) { 
      return "<div class='select2-user-result'>" + data.name + "</div>"; 
     }, 
     formatSelection: function(data) { 
      return data.name; 
     }, 
     initSelection : function (element, callback) { 
      var elementText = $(element).attr('data-init-text'); 
      callback({"name":elementText}); 
     } 
    }); 
});

它工作正常，但每次我輸入一個新字符搜索時，它總是讀取數據庫。所以我決定用另一種方式（在第一次檢索所有數據，並使用選擇2到搜吧）：

$(document).ready(function() { 
    $("#test").select2({ 
     createSearchChoice:function(term, data) { 
     if ($(data).filter(function() { 
     return this.text.localeCompare(term)===0; }).length===0) { 
     return {id:term, text:term};} 
    }, 
    multiple: false, 
    data: [{"id":"0","text":"ABC"},{"id":"1","text":"DEF I"},{"id":"2","text":"GHI"}] 
    }); 
});

但問題是我怎麼能傳遞給從中data_json.php和檢索數據的請求？說

data: $.ajax({ 
      url: "subject/data_json.php", 
      data: function (term, page) {// page is the one-based page number tracked by Select2 
       return { 
        college: "ABC", //search term 
       }; 
      } 
      dataType: "json", 
      success: function(data){ 
       return data 
      } 
     }

但它不工作，誰能幫助？謝謝

來源

2014-04-12 user3525186

你爲什麼離開你原來的代碼？

minimumInputLength: 1

增加此項，不會在輸入的第一個字符上調用搜索。例如，將它設置爲3將確保在輸入第三個字符之前不會進行ajax調用（因此不會查詢數據庫）。

來源

2014-05-20 17:02:10

如果我正確地理解了你的問題，你有data_json.php生成select2的選項，並且你希望加載它們所有的一次而不是使用select2每次用戶在搜索中輸入一個或多個字符時運行一個ajax查詢。

這就是我在類似情況下解決它的方式。 HTML：

<span id="mySelect"></span>

的Javascript：

$(document).ready(function() { 
    $.ajax('/path/to/data_json.php', { 
    error: function (xhr, status, error) { 
     console.log(error); 
    }, 
    success: function (response, status, xhr) { 
     $("#mySelect").select2({ 
     data: response 
     }); 
    } 
    }); 
});

我發現上面的，如果你創建一個<select>元素而不是一個<span>不起作用。

來源

2015-02-09 10:56:00 mjs2020

另一種方式來加載遠程數據在選擇二

回答

相關問題