alp*_*ogg 5 grid extjs store extjs4
出于某种原因,ExtJS4网格的这种配置不会更新.当您单击一个单元格,更改一个值时,它会命中创建URL,而不是代理中定义的更新URL,并在FF4中使用Firebug进行观察.奇怪的是,datachanged事件在页面启动时加载存储后触发,但在数据实际更改后不会触发.此外,网格将所有行发送到创建URL.
谁能告诉我我做错了什么?
Ext.onReady(function() {
Ext.BLANK_IMAGE_URL = '/images/extjs4/s.gif';
Ext.tip.QuickTipManager.init();
//Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider'));
Ext.define('VendorError', {
extend: 'Ext.data.Model',
fields: [
{name: 'UnexpSrvID', type: 'int'},
{name: 'VendorID', type: 'int'},
{name: 'VendorName', type: 'string'},
{name: 'VndActID', type: 'int'},
{name: 'VndActNb', type: 'string'},
{name: 'InvoiceID', type: 'int'},
{name: 'VInvNb', type: 'string'},
{name: 'VInvRcptDt', type: 'date', dateFormat: 'Y-m-d' },
{name: 'InvDate', type: 'date', dateFormat: 'Y-m-d' },
{name: 'CodeSpecifier', type: 'string'},
{name: 'Recurrence', type: 'string'},
{name: 'ClientID', type: 'int'},
{name: 'ClientName', type: 'string'},
{name: 'LocID', type: 'int'},
{name: 'LocName', type: 'string'},
{name: 'RecentLocStatus', type: 'string'},
{name: 'RecentLocStatusDate', type: 'date', dateFormat: 'Y-m-d' },
{name: 'UnexpCost', type: 'float'},
{name: 'ConfirmedAmt', type: 'float'},
{name: 'StaffID', type: 'int'},
{name: 'NetworkID', type: 'string'},
{name: 'UnexpStatCode', type: 'string'}
],
proxy: {
type: 'ajax',
simpleSortMode: true,
api: {
read: '/internal/viewVERext_json.asp',
create: '/internal/viewVERext_create.asp',
update: '/internal/viewVERext_update.asp',
destroy: '/internal/viewVERext_destroy.asp'
},
reader: {
type: 'json',
totalProperty: 'total',
successProperty: 'success',
messageProperty: 'message',
root: 'data'
},
writer: {
type: 'json',
writeAllFields: false,
allowSingle: false,
root: 'data'
},
listeners: {
exception: function(proxy, response, operation){
Ext.MessageBox.show({
title: 'REMOTE EXCEPTION',
msg: operation.getError(),
icon: Ext.MessageBox.ERROR,
buttons: Ext.Msg.OK
});
}
}
}
});
var store = Ext.create('Ext.data.Store', {
model: 'VendorError',
autoLoad: true,
autoSync: true,
pageSize: 20,
remoteSort: true,
listeners: {
// write: function(proxy, operation){
// if (operation.action == 'destroy') {
// main.child('#form').setActiveRecord(null);
// }
// Ext.example.msg(operation.action, operation.resultSet.message);
// }
datachanged: function() {
var report = "";
store.each(
function(rec) {
report = report + rec.dirty + '/';
}
)
alert(report);
}
}
});
// create the Grid
var grid = Ext.create('Ext.grid.Panel', {
store: store,
//stateful: true,
//stateId: 'stateGrid',
columns: [
{ text : 'Vendor',
dataIndex: 'VendorName',
flex : 1
},
{ text : 'Account',
dataIndex: 'VndActNb'
},
{ text : 'Invoice',
dataIndex: 'VInvNb'
},
{ text : 'Invoiced',
dataIndex: 'InvDate',
xtype : 'datecolumn',
align : 'center'
},
{ text : 'Receipted',
dataIndex: 'VInvRcptDt',
xtype : 'datecolumn',
align : 'center'
},
{ text : 'Description',
dataIndex: 'CodeSpecifier'
},
{ text : 'Client',
dataIndex: 'ClientName'
},
{ text : 'Location',
dataIndex: 'LocName'
},
{ text : 'LStatus',
dataIndex: 'RecentLocStatus',
align : 'center'
},
{ text : 'Credit',
dataIndex: 'UnexpCost',
tdCls : 'colyellow',
renderer : Ext.util.Format.usMoney,
align : 'right',
field : { xtype:'textfield', allowBlank:false }
},
{ text : 'Confirmed',
dataIndex: 'ConfirmedAmt',
tdCls : 'colyellow',
renderer : Ext.util.Format.usMoney,
align : 'right',
field : { xtype:'textfield', allowBlank:false }
},
{ text : 'Recurrence',
dataIndex: 'Recurrence',
tdCls : 'colyellow',
align : 'center',
field : {
xtype : 'combobox',
typeAhead: true,
triggerAction: 'all',
selectOnTab: true,
store: [
['once','once'],['1st','1st'],['2nd+','2nd+']
],
lazyRender: true
}
},
{ text : 'CStatus',
dataIndex: 'UnexpStatCode',
tdCls : 'colyellow',
align : 'center',
field : {
xtype : 'combobox',
typeAhead: true,
triggerAction: 'all',
selectOnTab: true,
store: [
<%=cstat_grid%>
],
lazyRender: true
}
},
{ text : 'Owner',
dataIndex: 'NetworkID',
tdCls : 'colyellow',
field : {
xtype : 'combobox',
typeAhead: true,
triggerAction: 'all',
selectOnTab: true,
store: [
<%=staff_grid%>
],
lazyRender: true
}
}
],
layout: 'fit',
height: 500,
renderTo: 'theGrid',
selType: 'cellmodel',
plugins: [
Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
})
],
dockedItems: [
{ xtype: 'pagingtoolbar',
store: store,
dock: 'bottom',
displayInfo: true
},
{ xtype: 'toolbar',
dock: 'top',
items: [
{ xtype:'button',
text: 'IsDirty()',
handler: function() {
var report = "";
store.each(
function(rec) {
report = report + rec.dirty + '/';
}
)
alert(report);
}
}
]
}
],
viewConfig: {
stripeRows: true
}
});
Ext.EventManager.onWindowResize(grid.doLayout, grid);
});
Run Code Online (Sandbox Code Playgroud)
事实证明,问题在于添加到网格中的记录被唯一 id 字段的值检测为“不是新的”。Sencha 论坛上的一张友善的海报向我指出了这一点。
默认情况下,模型中的该字段的名称应为“id”。因此,您必须提供一个具有“id”字段的模型,而我上面的模型没有该字段,或者您必须使用Ext.data.Model的 idProperty 属性覆盖默认列。我只是将该UnexpSrvId
列重命名为id
. 而且,你瞧,我们将更新发送到 update() 而不是 create()。
从 API 文档中来看这一点并不明显,因为不幸的是,很多东西都在这个强大的框架中。
归档时间: |
|
查看次数: |
5142 次 |
最近记录: |