pass in model by reference
by Durtto
HTML
<link rel="stylesheet" href="//extjs.cachefly.net/ext-4.1.0-gpl/resources/css/ext-all-gray-debug.css" />
<script src="//extjs.cachefly.net/ext-4.1.0-gpl/ext-all-dev.js"></script>
JavaScript
/* this is a function to simulate ajax requests in jsfiddle */
function sim(proxy, data, delay) {
if (typeof data !== 'string') {
data = Ext.JSON.encode(data);
}
proxy.url = '/echo/json/';
proxy.actionMethods.read = "POST";
proxy.extraParams.json = data;
proxy.extraParams.delay = typeof delay == 'undefined' ? 0 : delay;
}
Ext.define('Contact', {
extend: 'Ext.data.Model',
fields: ['name'],
proxy: {
type: 'ajax',
url: '/contacts',
reader: {
type: 'json'
}
}
});
Ext.define('Contacts', {
extend: 'Ext.data.Store',
model: 'Contact'
});
Ext.define('Grid1', {
extend: 'Ext.grid.Panel',
height: 250,
width: 400,
title: 'My Grid Panel',
initComponent: function() {
var me = this;
Ext.applyIf(me, {
store: new Contacts(),
columns: [
{
xtype: 'gridcolumn',
dataIndex: 'name',
flex:1,
text: 'Name'}
],
viewConfig: {
},
listeners: {
itemdblclick: function(view, record, item, index, e) {
var w = new Window1();
w.show();
w.down('form').loadRecord(record);
w.callback = Ext.bind(this.contactEdited, this); // <-- Bind lets you set the scope of the callback
}
}
});
me.callParent(arguments);
},
contactEdited: function(sender, args) {
sender.close();
this.store.sync();
}
});
Ext.define('Window1', {
extend: 'Ext.window.Window',
height: 250,
width: 400,
title: 'My Window',
initComponent: function() {
var me = this;
Ext.applyIf(me, {
layout: 'fit',
items: [
{
xtype: 'form',
bodyPadding: 10,
items: [
...