(Sorry in advance if the post is to long, I just add all the code that is involved in the problem, then I think it could be easier to get an answer)
Hello, I'm encountering a problem when I try to update a store in extjs 4.
To back up a little I'm developing a general grid where you can send the columns you need and also a the fields in a window to add new rows to the grid, then this is the general grid:
Ext.define('masterDataGridControls', {
extend : 'Ext.grid.Panel',
id : 'panelWin',
windowItems : null,
addWin : null,
initComponent : function() {
var me = this;
Ext.applyIf(me, {
dockedItems : [{
xtype : 'toolbar',
dock : 'top',
items : [{
xtype : 'button',
id : 'btn_delete',
iconCls : 'deleteIcon',
tooltip : 'Delete row or group',
handler : function() {
var selection = me.getView()
.getSelectionModel()
.getSelection()[0];
if (selection) {
store.remove(selection);
}
}
}, {
xtype : 'button',
id : 'btn_add',
iconCls : 'addIcon',
tooltip : 'Add row or group',
handler : me.addToList
}]
}]
});
me.callParent(arguments);
},
getAddWindow : function() {
if (!this.addWin) {
this.addWin = new windowPop({
formItems : this.windowItems,
idParent : this.config.id,
record : this.store.model.prototype
});
}
return this.addWin;
},
addToList : function() {
var addWindow = this.findParentByType().findParentByType()
.getAddWindow();;
addWindow.show();
}
});
And I have the class windowPop that is the one who receives the fields, display them and save the data:
Ext.define("windowPop", {
extend : "Ext.window.Window",
formPanel : null,
formItems : null,
record : null,
idParent : null,
initComponent : function() {
var me = this;
me.formPanel = new Ext.form.Panel({
items : this.formItems,
layout: 'anchor'
});
Ext.applyIf(me, {
resizable : false,
closable : false,
width : 300,
minWidth : 300,
minHeight : 200,
y : 150,
layout : 'fit',
plain : true,
modal : true,
items : [me.formPanel],
buttons : [{
text : "i_Save",
handler : function() {
console.info(me.record);
me.formPanel.getForm().updateRecord(me.record);
Ext.getCmp(me.idParent).fireEvent("winSave",me.record);
me.formPanel.getForm().reset();
me.hide();
}
}, {
text : 'i_Cancel',
handler : function() {
me.formPanel.getForm().reset();
me.hide();
}
}]
});
me.callParent(arguments);
}
});
And I have my specific grid, where I define a data.model and for now I'm using a fixed store, but later on will be replace by the one I get from the server:
Ext.define('userKeys', {
extend : 'Ext.data.Model',
fields : [{
name : 'text',
type : 'string'
}, {
name : 'description',
type : 'string'
}, {
name : 'group',
type : 'string'
}]
});
var store = Ext.create('Ext.data.Store', {
model: 'userKeys',
data : [{
text : "que mamera",
description : "asdfasdf",
group : 'homework'
}, {
text : "book report",
description : 'hola',
group : 'homework'
}, {
text : "alegebra",
description : "haha",
group : 'homework'
}, {
text : "buy lottery tickets",
description : "kajsdf",
group : 'homework'
}]
});
Ext.define('ConfigInterfacesUserKeys', {
extend : 'masterDataGridControls',
initComponent : function() {
var me = this;
me.columns = [{
id : 'cl_input',
header : 'i_Text',
dataIndex : 'text',
width : 220
}, {
header : 'i_Description',
dataIndex : 'description',
width : 130
}, {
header : 'i_group',
dataIndex : 'group',
width : 130
}];
me.windowItems = [{
xtype : 'textfield',
id : 'txt_sendTime',
fieldLabel : 'text',
margin : '5 0 0 5',
style : 'font-weight:bold',
labelWidth : 120,
name : 'text'
}, {
xtype : 'textfield',
id : 'txt_waitTime',
fieldLabel : 'description',
margin : '5 0 0 5',
style : 'font-weight:bold',
labelWidth : 120,
name : 'description'
}, {
xtype : 'textfield',
id : 'txt_group',
fieldLabel : 'group',
margin : '5 0 0 5',
style : 'font-weight:bold',
labelWidth : 120,
name : 'group'
}];
me.store = store;
me.callParent(arguments);
}
})
The Problem
When I try to save the fields as you see in the windowPop class Im doing this:
me.formPanel.getForm().updateRecord(me.record);
But I get the next error:
this[this.persistenceProperty] is undefined
I tracked down the error and I find that all start when in the function updateRecord try to set the object to the store:
updateRecord: function(record) {
var fields = record.fields,
values = this.getFieldValues(),
name,
obj = {};
fields.each(function(f) {
name = f.name;
if (name in values) {
obj[name] = values[name];
}
});
record.beginEdit();
**record.set(obj);**
record.endEdit();
return this;
}
I don't know if it is something wrong when I send the model to the window from the general grid, I sent it this way:
record : this.store.model.prototype
Then I'm not sure if its because the model I'm sending its not well forme.
I've been searching the internet but I can't find a proper answer then it will be really helpful if you can guide me in the right way.
Thanks