我是第一次自动加载Extjs网格,它加载了来自servlet的所有值。该网页还具有基于其(用户的输入)正在创建另一网格的表单。 When the new grid is being created i don't want the old one
。或is there another way to load only the store?
代码如下:
Ext.require([ 'Ext.grid.*', 'Ext.data.*', 'Ext.util.*', 'Ext.state.*',
'Ext.form.*',
'Ext.tip.QuickTipManager', 'Ext.ux.LiveSearchGridPanel' ]);
Ext.onReady(function() {
Ext.QuickTips.init();
var itemsPerPage = 50;
var simple = Ext.create('Ext.form.Panel', {
renderTo : 'form',
frame : true,
align : 'center',
title : 'Audit LOG',
bodyStyle : 'padding:5px 5px 0',
width : 825,
fieldDefaults : {
msgTarget : 'side',
labelWidth : 75
},
defaultType : 'textfield',
defaults : {
anchor : '100%'
},
items : [ {
fieldLabel : 'Date',
xtype : 'datefield',
name : 'Date',
id : 'Date',
format : 'd M Y',
allowBlank : false,
cls : 'input_single',
emptyText : 'dd-MMM-YYYY',
}, {
fieldLabel : 'Start Time',
name : 'sTime',
xtype : 'timefield',
id : 'sTime',
format : 'H:i:s',
altFormats : 'H:i:s'
}, {
fieldLabel : 'End Time',
name : 'eTime',
xtype : 'timefield',
id : 'eTime',
format : 'H:i:s',
altFormats : 'H:i:s'
} ],buttons : [ {
text : 'GO',
handler : function() {
var startDate = Ext.getCmp('Date').getValue();
var sTime = Ext.getCmp('sTime').getRawValue();
var eTime = Ext.getCmp('eTime').getRawValue();
grid(startDate,sTime,eTime);
}
} ]
});
var store = Ext.create('Ext.data.Store', {
id : 'pageStore',
autoLoad : false,
fields : [ {
name : 'S_NO',
type : 'int'
},{
name : 'LoggedTime',
type : 'string'
}, {
name : 'Level',
type : 'string'
}, {
name : 'LoggerName',
type : 'string'
}, {
name : 'MethodName',
type : 'string'
}, {
name : 'AuditMessage',
type : 'string'
}, {
name : 'Customer',
type : 'string'
}, {
name : 'Activity',
type : 'string'
} ],
pageSize : itemsPerPage,
proxy : {
type : 'ajax',
url : '/LogHandlers/Log',
params : {
flag:'no'
},
reader : {
type : 'json',
root : 'itemsList',
totalProperty : 'totalCount'
}
}
});
store.load({
params : {
start : 0,
limit : itemsPerPage,
flag:'no'
}
});
var groupingFeature = Ext
.create(
'Ext.grid.feature.Grouping',
{
groupHeaderTpl : '{columnName}:{groupValue} ({rows.length} Item{[values.rows.length > 1 ? "s" : ""]})',
hideGroupedHeader: true
});
var userGrid = new Ext.create('Ext.ux.LiveSearchGridPanel', {
renderTo : 'logs',
height : 600,
store : store,
features : [ groupingFeature
],
columns : [ {
header : 'S_NO',
dataIndex : 'S_NO',
items: [{
icon : "extjs/resources/ext-theme-classic/images/menu/menu-parent.gif" // Use a URL in the icon config
}]
},{
header : 'LoggedTime',
dataIndex : 'LoggedTime'
}, {
header : 'Level',
dataIndex : 'Level',
groupable : false,
}, {
header : 'LoggerName',
dataIndex : 'LoggerName',
groupable : false
}, {
header : 'MethodName',
dataIndex : 'MethodName',
groupable : false
}, {
header : 'AuditMessage',
dataIndex : 'AuditMessage',
groupable : false
}, {
header : 'Customer',
dataIndex : 'Customer'
}, {
header : 'Activity',
dataIndex : 'Activity'
} ],
dockedItems : [ {
xtype : 'pagingtoolbar',
pageSize : itemsPerPage,
store : store, // same store GridPanel is using
dock : 'bottom',
displayInfo : true,
text : 'Show Preview',
beforePageText : 'Page',
afterPageText : 'of {0}',
mode : 'local',
width : 50,
displayMsg : 'Displaying {0} - {1} of {2}',
emptyMsg : 'No Records to display'
}],
viewConfig : {
forceFit : true
}
});
});
function grid(startDate,sTime,eTime) {
var itemsPerPage = 50;
var store = Ext.create('Ext.data.Store', {
id : 'pageStore',
autoLoad : false,
fields : [ {
name : 'S_NO',
type : 'int'
},{
name : 'LoggedTime',
type : 'string'
}, {
name : 'Level',
type : 'string'
}, {
name : 'LoggerName',
type : 'string'
}, {
name : 'MethodName',
type : 'string'
}, {
name : 'AuditMessage',
type : 'string'
}, {
name : 'Customer',
type : 'string'
}, {
name : 'Activity',
type : 'string'
} ],
pageSize : itemsPerPage,
proxy : {
type : 'ajax',
url : '/LogHandlers/Log',
actionMethods: {
read: 'POST'
},
params : {
Date : startDate,
startTime : sTime,
endTime : eTime,
flag:'yes'
},
reader : {
type : 'json',
root : 'itemsList',
totalProperty : 'totalCount'
}
}
});
store.load({
params : {
start : 0,
limit : itemsPerPage,
Date : startDate,
startTime : sTime,
endTime : eTime,
flag:'yes'
}
});
var groupingFeature = Ext
.create(
'Ext.grid.feature.Grouping',
{
groupHeaderTpl : '{columnName}:{groupValue} ({rows.length} Item{[values.rows.length > 1 ? "s" : ""]})',
hideGroupedHeader: true
});
var userGrid = new Ext.create('Ext.ux.LiveSearchGridPanel', {
renderTo : 'logs',
height : 600,
store : store,
features : [ groupingFeature
],
columns : [ {
header : 'S_NO',
dataIndex : 'S_NO',
items: [{
icon : "extjs/resources/ext-theme-classic/images/menu/menu-parent.gif" // Use a URL in the icon config
}]
},{
header : 'LoggedTime',
dataIndex : 'LoggedTime'
}, {
header : 'Level',
dataIndex : 'Level',
groupable : false,
}, {
header : 'LoggerName',
dataIndex : 'LoggerName',
groupable : false
}, {
header : 'MethodName',
dataIndex : 'MethodName',
groupable : false
}, {
header : 'AuditMessage',
dataIndex : 'AuditMessage',
groupable : false
}, {
header : 'Customer',
dataIndex : 'Customer'
}, {
header : 'Activity',
dataIndex : 'Activity'
} ],
dockedItems : [ {
xtype : 'pagingtoolbar',
pageSize : itemsPerPage,
store : store, // same store GridPanel is using
dock : 'bottom',
displayInfo : true,
text : 'Show Preview',
beforePageText : 'Page',
afterPageText : 'of {0}',
mode : 'local',
width : 50,
displayMsg : 'Displaying {0} - {1} of {2}',
emptyMsg : 'No Records to display'
}],
viewConfig : {
forceFit : true
}
});
}
答案 0 :(得分:1)
您是说您要删除网格并重新创建它,以从服务器提取更新的数据?如果是这种情况,只需在您的商店中调用load()
(使用您要传入的任何参数,就像您在代码中一样),这将加载最新数据,与您创建时相同商店和网格。您可以通过调用getStore()
从网格中获取商店,因此它看起来像这样:
userGrid.getStore().load();