分页网格显示所有记录 - Ext JS [英] Paging Grid displaying all records - Ext JS
问题描述
编辑
事实证明，商店不能拥有重复的ID。当我删除此字段时，所有记录显示 - 这意味着网格不符合 pageSize
我收到我的所有商店记录显示在我的网格中有问题。数据正在从JSON请求中正确返回，并且pagingtoolbar的行为正确。
这是我的商店：
var store = Ext.create 'Ext.data.Store'，{
storeId：'resultsetstore'，
autoLoad：false，
model：model，
pageSize：itemsPerPage，// 3
代理：{
类型：'ajaxwithpayload'，//自定义ajax代理读取'jsonData'
url：'MCApp'，
jsonData：searchquery，
reader：{
type：'json'，
root：'elements'
}
}
}）;
我在这里加载商店，并返回所有正确的结果：
store.load（{
params：{start：0，limit：itemsPerPage}，
callback：function（records，operation，成功）{
if（success）{
mainresponse = operation.response.responseText;
if（mainresponse.length == 0）{
alert（'No results returned'） ;
return;
}
var jsonResponse = Ext.JSON.decode（mainresponse）;
}
else {
alert（'Search Failed：Could没有到达服务器'）;
}
最后，一个简单的网格为 pagingtoolbar ：
var grid = Ext.create（'Ext.grid.Pane l'，{
title：'Test Data'，
store：store，
columns：[{
text：'Technical Name'，
dataIndex：'tech '
}，{
text：'ID'，
dataIndex：'element.id'
}，{
text：'Name'，
dataIndex：'name'，
mapping：'element.name'
}，{
text：'View'，
dataIndex：'view'
}，{
text：'Description'，
dataIndex：'description'
}]，
dockedItems：[{
xtype：'pagingtoolbar'，
store：商店，
pageSize：itemsPerPage，
dock：'bottom'，
displayInfo：true
}]，
renderTo：Ext.getBody（）
} ）;
这里的问题是，并不是我的所有结果都加载到网格中。看来当遇到重复的ID时，会缩小结果。那个可能不是问题，只是我的猜测
在我的日志中，我看到我需要返回的所有数据。在下面的图片中，我应该使用相同的元素ID 001 3行，但只显示一个：
另一件需要注意的是，当我点击我的分页工具栏上的下一个按钮时，结果不会改变，并且在我的控制台上也读取为 POST 。我不知道这是应该做的还是一个 GET ？
我用闪电表示如何 >令人震惊的 这是不行的
任何想法？
一个非常重要的事情要注意的是，服务器负责分页而不是ExtJS。服务器不得返回所有行，而只能返回当前页的行。您的服务器端代码必须考虑参数页面，开始和限制让客户端工作。
我认为，除了重复的ids，是您的问题的主要原因。特别是原因，为什么您在第一页和第二页看到相同的数据：
ExtJs向服务器询问第1页的数据并获取所有行。之后，ExtJs向服务器询问第2页的数据，并再次获得相同的行。这不行。
EDIT
It turns out that a store cannot have duplicate IDs. When i remove this field, All records display - which means the grid is not respecting the pageSize
I'm having an issue getting all my store records to display in my grid. The data is returning appropriately from a JSON request, and the pagingtoolbar behaves correctly.
Here's my store:
var store = Ext.create('Ext.data.Store', {
storeId : 'resultsetstore',
autoLoad : false,
model : model,
pageSize : itemsPerPage, // 3
proxy: {
type : 'ajaxwithpayload', //custom ajax proxy to read 'jsonData'
url : 'MCApp',
jsonData: searchquery,
reader: {
type : 'json',
root : 'elements'
}
}
});
I load the store here, and all the correct results are returned:
store.load({
params: { start: 0, limit: itemsPerPage },
callback : function(records, operation, success) {
if(success) {
mainresponse = operation.response.responseText;
if( mainresponse.length == 0 ){
alert('No results returned');
return;
}
var jsonResponse = Ext.JSON.decode(mainresponse);
}
else {
alert('Search Failed: Could not reach the server');
}
And lastly, a simple grid with pagingtoolbar:
var grid = Ext.create('Ext.grid.Panel', {
title: 'Test Data',
store: store,
columns: [{
text: 'Technical Name',
dataIndex: 'tech'
}, {
text: 'ID',
dataIndex: 'element.id'
}, {
text: 'Name',
dataIndex: 'name',
mapping: 'element.name'
}, {
text: 'View',
dataIndex: 'view'
}, {
text: 'Description',
dataIndex: 'description'
}],
dockedItems: [{
xtype: 'pagingtoolbar',
store: store,
pageSize: itemsPerPage,
dock: 'bottom',
displayInfo: true
}],
renderTo: Ext.getBody()
});
The problem here is that not all of my results load into the grid. It seems that when a duplicate ID is encountered, it cuts the results short. That may not be the problem, just my guess
In my logs I see all the data I need returned. In the picture below, I should have 3 rows with the same Element ID 001, however only one is displayed:
Another thing to note is that when I click the Next Button on my pagingtoolbar, the results do not change, and it also reads as a POST on my console. I'm not sure if it's supposed to do that or be a GET?
I used lightning bolts to show how shocking it is that this isn't working
Any ideas?
A very important thing to note is that the server is responsible for paging not ExtJS. The server must not return all rows, but only the rows of the current page. You server side code must take in account the parameters page, start and limit for getting the client side to work.
I think that, beside the duplicated ids, is the main reason for your problems. It is especially the reason, why you see the same data on page one and on page two:
ExtJs asks the server for the data of page 1 and gets all rows. Later, ExtJs asks the server for the data of page 2 and gets again the same rows. This cannot work.
这篇关于分页网格显示所有记录 - Ext JS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
