大家好,我正在使用直接网格示例进行小数据更新部分,问题是我无法使用单元插件更新数据,我能够添加和删除,它可以直接更新到 db,但是当我编辑现有字段它没有在屏幕上显示任何错误和更新,我没有在网络区域或 chrome 控制台上看到任何 POST 响应我不知道为什么它没有发生
这是代码,请帮忙
Ext.onReady(function() {
Ext.direct.Manager.addProvider(Ext.app.REMOTING_API);
//added model inside onready
Ext.define('PersonalInfo', {
extend: 'Ext.data.Model',
fields: ['id', 'name', 'address', 'state','st_one','st_two','st_three','st_for']
});
//separated store into unique var for guaranteeRange
var store = Ext.create('Ext.data.Store', {
id: 'store',
model: 'PersonalInfo',
autoLoad: true,
proxy: {
type: 'direct',
api: {
create:QueryDatabase.createRecord,
read:QueryDatabase.getResults,
update:QueryDatabase.updateRecords,
destroy:QueryDatabase.destroyRecord
}
}
});
var rowEditing = Ext.create('Ext.grid.plugin.RowEditing', {
clicksToMoveEditor: 1,
autoCancel: false
});
var alphaSpaceTest = /^[-\sa-zA-Z]+$/;
Ext.apply(Ext.form.field.VTypes, {
// vtype validation function
alphaSpace: function(val, field) {
return alphaSpaceTest.test(val);
},
// vtype Text property: The error text to display when the validation function returns false
alphaSpaceText: 'Not a valid state. Must not contain numbers.',
// vtype Mask property: The keystroke filter mask
alphaSpaceMask: /^[-\sa-zA-Z]+$/
});
// create the Grid
var grid = Ext.create('Ext.grid.Panel', {
//height: 550,
//width: 800,
cls: 'grid',
title: 'Production Planning Control',
store: store,
columns: [{
dataIndex: 'id',
width: 50,
text: 'ID'
}, {
dataIndex: 'name',
flex: 0.5,
text: 'ClientName',
//pt 2
allowBlank: false,
field: {
type: 'textfield',
allowBlank: false
}
}, {
dataIndex: 'address',
flex: 0.5,
text: 'Product Name',
//pt 2
allowBlank: false,
field: {
type: 'textfield',
allowBlank: false
}
}, {
dataIndex: 'state',
flex: 0.8,
text: 'No Of QtyRequired',
//pt 2
allowBlank: false,
field: {
type: 'textfield',
allowBlank: false,
//vtype: 'alphaSpace'
}
},{
dataIndex: 'st_one',
flex: 0.7,
text: 'Station 1',
//pt 2
allowBlank: false,
field: {
type: 'textfield',
//allowBlank: false,
//vtype: 'alphaSpace'
}
},
{
dataIndex: 'st_two',
flex: 0.7,
text: 'Station 2',
//pt 2
allowBlank: false,
field: {
type: 'textfield',
//allowBlank: false,
//vtype: 'alphaSpace'
}
},{
dataIndex: 'st_three',
flex: 0.7,
text: 'Station 3',
//pt 2
allowBlank: false,
field: {
type: 'textfield',
//allowBlank: false,
//vtype: 'alphaSpace'
}
},
{
dataIndex: 'st_for',
flex: 0.7,
text: 'Station 4',
//pt 2
allowBlank: false,
field: {
type: 'textfield',
//allowBlank: false,
//vtype: 'alphaSpace'
}
}
],
renderTo: Ext.getBody(),
//pt 2
plugins: [
rowEditing
],
dockedItems: [{
xtype: 'toolbar',
store: store,
dock: 'bottom',
//creating, add items
items: [{
iconCls: 'add',
text: 'Add',
handler: function() {
rowEditing.cancelEdit();
// create a record
var newRecord = Ext.create('PersonalInfo');
store.insert(0, newRecord);
rowEditing.startEdit(0, 0);
// write about this section in tutorial
var sm = grid.getSelectionModel();
grid.on('edit', function() {
var record = sm.getSelection();
store.record.commit();
//store.sync();
//e.record.commit();
//store.commitChanges();
store.remove(record);
store.load();
store.sync();
alert ('dome');
});
}
}, {
iconCls: 'delete',
text: 'Delete',
handler: function() {
rowEditing.cancelEdit();
var sm = grid.getSelectionModel();
Ext.Msg.show({
title:'Delete Record?',
msg: 'You are deleting a record permanently, this cannot be undone. Proceed?',
buttons: Ext.Msg.YESNO,
icon: Ext.Msg.QUESTION,
fn: function(btn){
if(btn === 'yes') {
store.remove(sm.getSelection());
store.sync();
}
}
});
}
},
{
xtype: 'button',
iconCls:'refresh',
text: 'Refresh Grid',
// action: 'refresh',
handler:function(){
//var reload=this.getGridPanel().getStore();
store.load();
}
}]
}]
});
});