我对EXT js 4.1.0中的分页感到困惑。我实现了分页显示正确的计数,但网格没有根据刷新页面进行更新。
Ext.define('person', {
extend: 'Ext.data.Model',
fields: [
// the 'name' below matches the tag name to read, except 'availDate'
// which is mapped to the tag 'availability'
{name: 'sso', type: 'string'},
{name: 'fname', type: 'string'},
// dates can be automatically converted by specifying dateFormat
{name: 'lname', type: 'string'},
{name: 'msso', type: 'string'},
{name: 'email_address', type: 'string'},
{name: 'person_status', type: 'string'}
]
});
var ds = new Ext.data.Store({
model:'person',
autoLoad: true,
//url:'/FormAction',
actionMethods: {create: "POST", read: "POST", update: "POST", destroy: "POST"},
proxy: {
type: 'ajax',
url: '/identityiq/FormAction',
reader: {
type: 'xml',
record: 'record'
},
}
});
ds.load({
params:{
start:0,
limit: 25
}
});
var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1,
listeners: {
validateedit: function(editor, e) {
//alert('New value (validateedit): ' + e.value);
},
edit: function(editor, e) {
//alert('Old value (edit): ' + e.value);
}
}
});
// create the Grid
var grid = Ext.create('Ext.grid.Panel', {
store: ds,
dockedItems:[
{
xtype: 'pagingtoolbar',
pageSize: 25,
store:ds,
dock: 'bottom',
displayInfo: true,
displayMsg:'Displaying records {0} - {1} of {2} ',
emptyMsg:"No records to display ",
flex:1
}
], columns: [
{
text : 'SSO',
width:80,
sortable : true,
dataIndex: 'sso'
},
{
id: 'fname',
header: 'First Name',
dataIndex: 'fname',
width:100,
field: {
allowBlank: false
}
},
{
id: 'lname',
header : 'Last Name',
width:100,
sortable : true,
dataIndex: 'lname',
field: {
allowBlank: false
}
},
{
text : 'Manager SSO',
width : 80,
sortable : true,
dataIndex: 'msso'
},
{
text : 'Email Address',
width : 200,
sortable : true,
dataIndex: 'email_address'
},
{
text : 'Personstatus',
width : 80,
sortable : true,
dataIndex: 'person_status'
}
],
selModel: {
selType: 'cellmodel'
},
height: 400,
width: 700,
title: 'Array Grid',
renderTo: 'myDiv',
viewConfig: {
stripeRows: true,
enableTextSelection: true
},
frame: true,
plugins: [cellEditing],
tbar: [
{
text: 'Save',
handler: function ()
{
alert(ds.getModifiedRecords());
console.log(ds.getModifiedRecords());
var modified_data ={};
modified_data = ds.getModifiedRecords();
for (var i = 0; i < modified_data.length; i++) {
var record = modified_data[i];
alert(record.data.fname);
}
}
}
],
});
尝试在不同论坛中提供的不同版本,但没有运气。网格不会随着页面的变化而刷新。
服务器端也需要进行任何更改以实现分页。
先谢谢。
感谢您的回复。 请找到我的服务器端代码,它是一个简单的Servlet,具有这种处理方法 - 请建议我为了工作分页需要更改的内容。
尝试{
ServletOutputStream sos = response.getOutputStream();
response.setHeader("Cache-Control","no-store");
response.setHeader("Pragma","no-cache");
response.setContentType("text/xml");
String query="select * from table'";
OracleDataSource ods = new OracleDataSource();
Connection conn = ods.getConnection();
Statement statement = conn.createStatement();
ResultSet rs = statement.executeQuery(query);
sos.println("<dataset>");
while(rs.next()) {
sos.println("<record>");
sos.println("<sso>"+ rs.getString("person_num_sso") +"</sso>");
sos.println("<fname>"+ rs.getString("first_name") +"</fname>");
sos.println("<lname>"+ rs.getString("last_name") +"</lname>");
sos.println("<msso>"+ rs.getString("manager_person_num") +"</msso>");
sos.println("<email_address>"+ rs.getString("email_address") +"</email_address>");
sos.println("<person_status>"+ rs.getString("person_status") +"</person_status>");
sos.println("</record>");
}
sos.println("</dataset>");
rs.close();
conn.close();
sos.close();
System.out.print("Done list servlet");
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
答案 0 :(得分:0)
虽然在没有看到服务器端代码的情况下我无法肯定地说,我的猜测是网格没有更新,因为下一页的每个请求都返回与第一页相同的数据。您的服务器端代码负责转换数据的“页面”,通常是通过向查询数据的任何内容发送限制/启动/页面。不过,首先要看的是Chrome Developer工具或Firebug,以确保您获得每页所需的数据。如果每页的数据相同,则表示您遇到服务器端代码问题。
但要记住的重要一点是,Ext JS并不负责分页数据。 “分页”工具栏所做的就是在AJAX请求中发送参数,该参数指示服务器如何转换所请求的数据......甚至此请求最终也基于服务器已经提供的信息(例如,总数)数据集大小)。在这方面,Ext JS与服务器的关系是“握手”:Ext JS请求数据并假设服务器将以它要求的格式返回。如果服务器不符合此请求,Ext JS无法知道(因为它不知道您在服务器上的数据),并且只会呈现它在响应中返回的任何数据。
这是我假设在你的情况下发生的事情:服务器为每个页面返回相同的记录。由于Ext JS无法区分这两者,因此它继续以其快乐的方式,根据服务器所存在的总数据集来分页数据。通过这种方式,您的网格正确刷新;它只是一个错误,因为刷新的数据不会改变。
答案 1 :(得分:0)
确实是您缺少的服务器端代码的变化。 您应该使用参数start和limit来限制查询,而不是select * from table,换句话说,您应该只返回网格页面所期望的记录集....而不是所有记录
* start和limit是商店默认发送的参数,在servlet上捕获它们
最好的问候@ code4jhon