I'm upgrading an app to ExtJS 5, and I can't seem to get a grid using RowEditing to POST the edited record back to my server.
Ext.define("MyRecordDef", { extend: "Ext.data.Model" });
var MyEditor = Ext.create('Ext.grid.plugin.RowEditing', { clicksToEdit: 1 });
var MyStore = new Ext.data.Store({
model: "MyRecordDef",
autoSync: true,
proxy: {
type: "ajax",
url: "ajaxurl.aspx",
batchActions: false,
extraParams: { Command: 'Save' },
reader: { type: "json", rootProperty: "rows" },
writer: { type: "json", encode: true, writeAllFields: true }
}
});
var MyGrid = new Ext.grid.GridPanel({
store: MyStore,
plugins: [ MyEditor ],
columns: [
{
id: "fieldtoedit",
dataIndex: "fieldtoedit",
editor: new Ext.form.NumberField()
}
]
});
The row editor comes up, I'm able to change the value and click the Update button, but then nothing happens. No request is made, no errors logged in the console.
I added the following:
MyGrid.on('edit', function (e) {
alert('You are Editing ' + e.context.record.id);
MyStore.sync(); // attempt to force a sync
});
I get the alert with the correct record number, but still no AJAX request. It's like ExtJS is completely ignoring the writer.
I don't have different endpoints for each CRUD operation, so I'm not using the api
config option, it should be using the url
.
First of all you must define rootProperty
on writer
when you use encode: true
.
Then after adding fields
to MyRecordDef
requests are sended.
Working sample: http://jsfiddle.net/jjVwR/3/ (saving don't work, but you can see on console that request is send)