劍道從遠程服務數據，做分頁本地

Question

代碼：

var url = base_url + "/api/v1/users/getUsers"; 
var dataSource = new kendo.data.DataSource({ 
    transport: { 
    read: function (options) { 
     $.ajax({ 
      type: 'GET', 
      url:url, 
      dataType: 'json', 
      data: { searchTerm: $("#searchTerm").val().trim() }, 
      success: function (result) { 
      options.success(result); 
     }, 
     error: function (result) {    
      options.error(result); 
     } 
     }); 
    } 
    }, 
    schema: { 
    data: function (result) { 
    return result.model; 
    }, 
    total: function (result) { 
     return result.model.length; 
    }, 
    }, 
    pageSize: 5 
}); 

$("#matches").kendoListView({ 
    dataSource: dataSource, 
    autoBind: false, // if set to false the widget will not bind to the data source during initialization. 
    template: kendo.template($("#matchesListViewTemplate").html()) 
}); 

$("#pager").kendoPager({ 
    dataSource: dataSource, 
    autoBind: false 
}); 

$(document).keypress(function (e) { 
    if (e.which == 13) { 
    e.preventDefault();  

    var searchTerm = $("#searchTerm").val().trim(); 
    if (searchTerm.length < 1) 
     return; 

    dataSource.read(); 
    dataSource.page(1); // makes another call to the remote service 
    } 
}); 

因爲數據源是遠程的，當我們調用dataSource.page（1），劍道問題再次調用遠程服務。這種行爲在這個so post描述：

如果你是做服務器端分頁應該夠做grid.dataSource.page（1），因爲這將調用讀完全按照你已經實現。

我必須改變什麼，以便在我用新的searchTerm搜索之後，API調用將只執行一次，並且尋呼機將轉到第1頁而不再調用？

我試過用dataSource.query（）但仍然沒有運氣？我希望我足夠證明。

Answer 1

解決方法是在dataSource.read（）獲取數據/完成時調用dataSource.page（1）。

$(document).keypress(function (e) { 
    if (e.which == 13) { 
    e.preventDefault();  

    var searchTerm = $("#searchTerm").val().trim(); 
    if (searchTerm.length < 1) 
     return; 

    dataSource.read().done(function() { 

     // in case remote service returns empty result set (but still http 200 code) 
     // page() makes another request (if data() is empty it makes another request) 
     // therefore we must check data length/total 
     if(dataSource.total() > 0) 
     dataSource.page(1); 
    } 
}); 

如果讀請求的響應還沒有到達，或者如果發生了錯誤，另一讀取請求被允許（爲了取數據）。 DataSource.read（）發出異步請求，然後dataSource.page（1）開始執行。 DataSource.page（1）函數檢查是否有任何數據讀取，如果它不是它再次執行讀取方法 - 因此我們有2個調用，因爲你提到它。由於異步調用這種情況可能發生。