如何修改此Select2 javascript以啓用分頁？

我對JavaScript不太熟悉，所以我需要幫助。我有這個方法返回客戶列表（2000+），所以Select2下拉菜單掛起。我想啓用分頁功能，但我不確定需要更改哪些內容。這裏是我的javascript代碼：如何修改此Select2 javascript以啓用分頁？

var GetCutomerDDL = function(cient) { 

    var Json = {}, 
     customers = []; 

    $ddlCustomers.select2('val', ''); 
    Json.client = cient; 

    $.post(urlContent + 'Cutomer/GetCustomerDDL', Json, function(data) { 
    }, 'json').done(function(data) { 
     customers = data; 
     $ddlCustomers.select2({ 
      placeholder: "Select Customer(s)", 
      allowClear: true, 
      multiple: true, 
      data: customers 
     }); 
    }); 

};

GetCustomerDDL使用LINQ to剛剛返回所有客戶，但我想啓用分頁所以在下拉列表不會加載超過2000條記錄一次。我需要在JavaScript和服務器端進行更改？

來源

2013-05-31 Xaisoft

Select2控件包括"infinite scrolling"。這可能是你正在尋找的。

Scroll2的主頁在這裏找到：http://select2.github.io/

在服務器端，您需要使用Skip()和Take() LINQ運營商在數據向前跳，並從只需要一定數量的物品你數據。 Select2應該通過哪些項目跳過並帶到您的控制器。

編輯：

嘗試修改此：

$.post(urlContent + 'Cutomer/GetCustomerDDL', Json, function(data) { 
}, 'json').done(function(data) { 
    customers = data; 
    $ddlCustomers.select2({ 
     placeholder: "Select Customer(s)", 
     allowClear: true, 
     multiple: true, 
     data: customers 
    }); 
});

這樣：

$ddlCustomers.select2({ 
    ajax: { 
     url: urlContent + 'Cutomer/GetCustomerDDL', 
     dataType: 'json', 
     data: function (term, page) { 
     return { 
      q: term, // search term 
      pageLimit: 10, 
      page: page, // page number 
      client: client 
     }; 
     }, 
     results: function (data, page) { 
     var more = (page * 10) < data.total; // whether or not there are more results available 
     return { results: data.customers, more: more }; 
     } 
    }, 
});

在你的控制，你會想返回客戶的子列表「客戶」資產以及「全部」資產中的總客戶。

return Json(new { customers = customers.Skip(...).Take(...), 
    total = customers.Count() }, JsonRequestBehavior.AllowGet);

樣品JSON結果：

{ customers: [...], total: 2000 }

來源

2013-05-31 17:38:51

我知道如何處理服務器端和我一直在尋找的網頁，供選擇二，但我不如何修改的JavaScript。 – Xaisoft

Select2頁面有一個用於無限加載的示例javascript。關鍵是正確設置'ajax'屬性（'url'，'data'，'results'等） –

是的，我看到了，因爲我對javascript不熟悉，所以我不確定在哪裏設置這些屬性在我的例子中，即使使用Select2幫助。 – Xaisoft

如何修改此Select2 javascript以啓用分頁？

回答

相關問題