View Full Version : Grid.CRUD

9 Sep 2010, 5:48 PM
I'm studying ExtJS. I'm trying to make a table with CRUD. This is an example of my code.


var writer = new Ext.data.JsonWriter({
encode: true,
writeAllFields: false

var proxy = new Ext.data.HttpProxy({
api: {
read : 'read',
create : '?reate',
update: 'update',
destroy: 'delete'

var reader = new Ext.data.JsonReader({
totalProperty: 'totalCount'},

var store = new Ext.data.Store({
proxy: proxy,
reader: reader,
writer: writer,
autoSave: true


var title_edit = new Ext.form.TextField();

var grid = new Ext.grid.EditorGridPanel({
store: store,
renderTo: document.body,
clickstoEdit: 1,
columns: [
{id:'id',header: 'ID', width: 30, dataIndex: 'id',editor: title_edit},
{header: 'Name', width: 80, dataIndex: 'name',editor: title_edit},
{header: 'Description', width: 180, dataIndex: 'description',editor: title_edit}
height: 320,
width: 400,
title: 'Table',
loadMask: true,
bbar: new Ext.PagingToolbar({
pageSize: 10,
store: store,
displayInfo: true,
displayMsg: 'Displaying movies {0} - {1} of {2}',
emptyMsg: "No movies found"
text: 'Add',
handler: function(btn, ev) {
var u = new store.recordType({
name: '',
description : ''

store.insert(0, u);
grid.startEditing(0, 1);

} ]

It contains no errors - so says the FireBug. When I click on the button "Add" the following occurs: request to the server is sent with empty values, adding a new line in the table in edit mode.
But this is wrong ...
I watched an example in the documentation:
In this example, sending a request to the server is the last stage, first add a new row in the table, then I edit it, and only then - the request to the server.
How do I make the same in my code? please help.

10 Sep 2010, 12:43 AM
You copied this from one of the examples?

That example used allowBlank:false on the fields, which caused the newly added record to not be saved, because it is invalid.