PDA

View Full Version : Store Proxy becomes invalid after first use?



hermooz
14 Jan 2012, 8:04 AM
Hi all. I'm trying to learn to use Ext JS 4; In particular, I'd like to use an editable grid in a view of an application, backed by PHP.
I've mostly followed available examples and I've been able to create the grid, populate it with values from the database, and make it editable. All well, except for the "writer" part: if the user modifies data on the grid and then saves, "dirty" markers are removed and backend is correctly invoked, but only the first time; all subsequent tries only got an error message in javascript console that says "uncaught exception: You are using a ServerProxy but have not supplied it with a url.". Of course, I do have supplied the proxy with the Url; after all, the first try works correctly.
I'm pretty sure I'm doing something wrong, but I'm lost. Any help? This is relevant code:




Ext.Loader.setConfig({
enabled : true
});

Ext.require([
'Ext.grid.*',
'Ext.data.*',
'Ext.util.*',
'Ext.state.*',
'Ext.form.*'
]);

Ext.onReady(function() {

Ext.define('courses', {
extend : 'Ext.data.Model',
fields : [
'id',
'name',
'hours',
'valutation'
]
});

var store = Ext.create('Ext.data.Store', {
model : 'courses',
proxy : {
type : 'ajax',
api : {
read: '/index.php?r=controller/action',
destroy: '/index.php?r=controller/action&mode=delete',
update: '/index.php?r=controller/action&mode=update'
},
reader : 'json',
writer : {
type: 'json',
root: 'data'
},
extraParams: {
hidden_id: document.getElementById('hidden_id').value
}
},
autoLoad : true,
autoSync : false
});

var editing = Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit : 1,
// autoCancel : false
});

// create the grid
var grid = Ext.create('Ext.grid.Panel', {
store : store,
columns : [{
text : "Name",
width : 200,
dataIndex : 'name',
sortable : true,
editor : null
}, {
text : "Hours",
width : 160,
dataIndex : 'hours',
sortable : true,
editor : {
xtype: 'numberfield',
allowBlank : true
}
}, {
text : "Valutation",
width : 100,
dataIndex : 'valutation',
sortable : false,
editor : {
xtype : 'numberfield'
} ]
} ],
renderTo : 'Extjs-grid',
width : 650,
height : 200,
plugins : [ editing ],
listeners : {
'selectionchange' : function(view, records) {
grid.down('#removeEmployee').setDisabled(!records.length);
}
},
//frame : true,
tbar : [ {
itemId : 'removeEmployee',
text : 'Togli',
iconCls : 'employee-remove',
handler : function() {
var sm = grid.getSelectionModel();
editing.cancelEdit();
store.remove(sm.getSelection());
if (store.getCount() > 0) {
sm.select(0);
}
},
disabled : true
}, {
text : 'Salva',
iconCls : 'salva',
handler : function() {
editing.cancelEdit();
store.save();
}
} ]
});
});

kskrumpet
14 Jan 2012, 1:01 PM
I'm guessing that it's the use of store.save() - .save is a model method to use the proxy configured for the model, but you configued the proxy on the store. Try store.sync() instead.

hermooz
14 Jan 2012, 11:42 PM
Store.sync was my first try, and had the same problem. I changed it to store.save since I found it in another example, but the error is the same. Thank you for the advise, however: I'll revert the change since it seems that sync is the correct method to use.

bye!

kskrumpet
15 Jan 2012, 12:37 AM
Can you confirm - changing to store.sync() produces exactly the same error? If so I'll have another think - if not can you describe the problem with .sync?

hermooz
15 Jan 2012, 2:36 PM
Sure, I confirm. Even with the sync method, the first click works, and after that all I get is that error message. Checking with firebug I've seen that no data get sent to the server. If I reload the page, it works again, but always for one single time.

Thank you for your help, and bye

hermooz
16 Jan 2012, 2:51 AM
I forgot to add something that could be of use: the exception is thrown by this statement:


return Ext.Array.toArray(_root.querySelectorAll(_path));

(that's row 12151 of ext-debug.js, version 4.0.7).

Also, if I just delete rows from the grid, the sync works every time. Only if I do an update apparently the proxy get lost after the first try.

bye!

hermooz
16 Jan 2012, 8:57 AM
Anyone?

Is there some other information that I should collect and post?

Thanks,
bye!

hermooz
21 Jan 2012, 6:39 AM
I finally spotted the reason for this error. The message was right, after all: if I do add a url propriety to my store, it all works, albeit in an unpredictable (at least, to me) manner. After the first "update" operation, subsequent clicks on "save" button (that fires a store.sync method) cause *two* ajax requests to the backend: the second one is indeed the one with the updated rows, while the first is relative to a "create" operation with an empty row as payload. Since in my original version I did not use "create", I did not define an api method for that, so ExtJs tryed to build it with the missing url propriety, and that caused the error.
Now, I don't know if this is intended behaviour: I see no reason for this bogus extra operation. I can live with that, however.

bye!

alex873
15 Mar 2012, 8:00 AM
http://docs.sencha.com/ext-js/4-0/#!/guide/direct_grid_pt2
T (http://docs.sencha.com/ext-js/4-0/#!/guide/direct_grid_pt2)his worked for me.