ExtJs 4.2 使用 MVC 问题扩展自定义模型
Posted
技术标签:
【中文标题】ExtJs 4.2 使用 MVC 问题扩展自定义模型【英文标题】：ExtJs 4.2 Extend Custom Model using MVC problems 【发布时间】：2013-05-10 13:43:58 【问题描述】：使用带有 MVC 模式的 ExtJs 4.2
我正在尝试制作自定义模型、存储、代理、读取器、写入器，但在使其在 MVC 模式中工作时遇到问题。我跟着this example 扩展了一个模型，只有当它不以 MVC 方式使用时，我才能看到它工作。
My store 指的是模型属性中定义的诸如 Contacts 之类的模型，然后 Contacts 指的是使用模型属性的自定义模型 WakandaModel。但是，当我创建引用联系人的商店时，自定义 WakandaModel 中定义的模型属性或代理都没有被带到商店模型中。
这是我的代码，我已将 cmets 留在其中，以便您查看我尝试过的操作。感谢您的帮助！
应用代码
Ext.Loader.setConfig(
enabled : true,
paths :
'Ext.ux' : "lib/extux",
'Wakanda' : "lib/extux/wakanda"
);
Ext.application(
name : 'SimplyFundraising',
autoCreateViewport : true,
requires : ['Ext.ux.Router', // Require the UX
'Ext.window.MessageBox'],
controllers : ['Contacts'],
);
自定义模型
Ext.define('Wakanda.Model',
extend: 'Ext.data.Model',
idProperty: '__KEY',
stampProperty: '__STAMP',
defaultProxyType: 'wakanda',
onClassExtended: function(cls, data)
// debugger;
// cls.apply(this)
// var parts = data.$className.split('.');
// var entity = parts[2]
// var catalog = this.prototype.getCatalog(entity),
// attributes = catalog.attributes;
// for (var i = 0, l = attributes.length; i < l; i++)
// if (attributes[i].name === 'ID')
// attributes[i].persist = false;
//
//
// attributes.push(name: this.prototype.idProperty);
// attributes.push(name: this.prototype.stampProperty);
// // data.fields = attributes;
// // debugger;
// //this.setFields(data.fields)
// // var mymodel = Ext.ModelManager.getModel(data.$className);
// debugger;
// Ext.appy(this);
// //this.superclass.superclass.$onExtended.apply(this, arguments);
,
getCatalog: function(className)
var catalog;
Ext.Ajax.request(
async: false,
url: 'http://127.0.0.1:8081/cors/$catalog/' + className,
success: function(response)
catalog = Ext.decode(response.responseText);
);
return catalog;
);
自定义代理
Ext.define('Wakanda.Proxy',
extend: 'Ext.data.proxy.Rest',
// alternateClassName: 'SimplyFundraising.data.WakandaProxy',
alias : 'proxy.wakanda',
sortParam: '$orderby',
filterParam: '$filter',
startParam: '$skip',
limitParam: '$top',
// groupersParam: '$group',
reader: 'wakanda',
writer: 'wakanda',
actionMethods:
create : 'POST',
read : 'GET',
update : 'POST',
destroy: 'POST'
,
buildUrl: function(request)
debugger;
var modelName = this.model.modelName,
operation = request.operation,
records = operation.records || [],
record = records[0],
id = record ? record.getId() : operation.id,
url = '/cors/' + modelName,
action = request.action;
if (this.appendId && id && (action === 'read' || action === 'destroy'))
url += '(' + id + ')';
request.url = url;
// console.log("buildUrl", this, arguments, request.url);
if (action !== 'read')
if (action === 'create') action = 'update';
else if (action === 'destroy') action = 'delete';
url = Ext.urlAppend(url, '$method=' + action);
if (this.noCache)
url = Ext.urlAppend(url, Ext.String.format("0=1", this.cacheString, Ext.Date.now()));
return url;
,
encodeSorters: function(sorters)
var min = [],
length = sorters.length,
i = 0, sort = '';
for (; i < length; i++)
sort += sorters[i].property + ' ' + sorters[i].direction + ' ';
return sort;
,
encodeFilters: function(filters)
var min = [],
length = filters.length,
i = 0, filter = '';
for (; i < length; i++)
filter += filters[i].property + ' eq ' + filters[i].value + '@ ';
return filter;
);
自定义阅读器
Ext.define('Wakanda.reader',
extend: 'Ext.data.reader.Json',
//alternateClassName: 'SimplyFundraising.data.WakandaReader',
alias : 'reader.wakanda',
root: '__ENTITIES',
totalProperty: '__COUNT',
getData: function(data)
if (Ext.isObject(data) && !data[this.root])
data = [data];
return data;
);
自定义编写器
Ext.define('Wakanda.writer',
extend: 'Ext.data.writer.Json',
// alternateClassName: 'SimplyFundraising.data.WakandaWriter',
alias: 'writer.wakanda',
writeAllFields: false,
getRecordData: function(record)
var isPhantom = record.phantom === true,
writeAll = this.writeAllFields || isPhantom,
nameProperty = this.nameProperty,
fields = record.fields,
data = ,
changes,
name,
field,
key;
if (writeAll)
// console.log("getRecordData1", this, arguments);
fields.each(function(field)
if (field.persist)
name = field[nameProperty] || field.name;
data[name] = record.get(field.name);
else
);
else
changes = record.getChanges();
// console.log("getRecordData2", this, arguments, changes);
for (key in changes)
if (changes.hasOwnProperty(key))
field = fields.get(key);
name = field[nameProperty] || field.name;
data[name] = changes[key];
if (!isPhantom)
data[record.idProperty] = record.getId();
data[record.stampProperty] = record.get(record.stampProperty);
return '__ENTITIES': [data];
);
联系人模型
Ext.define('SimplyFundraising.model.Contact',
extend : 'Wakanda.Model' ,
//constructor: function()
//alert(“Going to call parent’s overriden constructor…”);
// this.callParent(arguments);
// return this;
//
);
联系人商店
Ext.define('SimplyFundraising.store.Contacts',
extend : 'Ext.data.Store',
model : 'SimplyFundraising.model.Contact',
autoLoad : true,
autoSync : true,
// constructor: function()
// this.model = Ext.create('SimplyFundraising.model.Contact')
//alert(“Going to call parent’s overriden constructor…”);
// this.callParent(arguments);
return this;
//
);
联系人控制器
Ext.define('SimplyFundraising.controller.Contacts',
extend : 'Ext.app.Controller',
models : ['Contact'],
views : ['contacts.List', 'contacts.Edit'],
init : function()
this.control(
'contactslist' :
itemdblclick : this.editContact,
removeitem : this.removeContact
,
'contactslist > toolbar > button[action=create]' :
click : this.onCreateContact
,
// 'contactsadd button[action=save]':
// click: this.doCreateContact
// ,
'contactsedit button[action=save]' :
click : this.updateContact
);
,
list : function()
// var mystore = Ext.StoreMgr.lookup('Contacts');
// var myContact = this.getModel('Contact')
// var User = this.getModel('User');
//debugger;
// var mystore = Ext.create('SimplyFundraising.store.Contacts')
// var myContact = this.getModel('Contact').create()
// var bb = myContact.create()
// var rr = Ext.create('SimplyFundraising.model.Contact')
var mystore = Ext.create('SimplyFundraising.store.Contacts')
debugger;
// mystore.proxy.api.read = users.proxy.api.read + '(17)'
//mystore.proxy.extraParams = $expand: 'ContactType';
mystore.load();
//var test = Ext.ModelManager.getModel('Contact');
// //var User = this.getContactModel();
// User.load(258,
// success: function(user)
// console.log("Loaded user 258: " + user.get('lastName'));
//
// );
,
editContact : function(grid, record)
var view = Ext.widget('contactsedit');
view.down('form').loadRecord(record);
this.addnew = false
,
removeContact : function(Contact)
Ext.Msg.confirm('Remove Contact ' + Contact.data.lastName, 'Are you sure?', function(button)
if (button == 'yes')
this.getContactsStore().remove(Contact);
, this);
,
onCreateContact : function()
var view = Ext.widget('contactsedit');
this.addnew = true
,
// doCreateContact: function (button)
// var win = button.up('window'),
// form = win.down('form'),
// values = form.getValues(),
// store = this.getContactsStore();
// if (form.getForm().isValid())
// store.add(values);
// win.close();
//
// ,
updateContact : function(button)
var win = button.up('window'), form = win.down('form'), record = form.getRecord(), values = form.getValues(), store = this.getContactsStore();
if (form.getForm().isValid())
if (this.addnew == true)
store.add(values);
else
record.set(values);
win.close();
);
【问题讨论】：
【参考方案1】：我现在开始工作了：
看起来我的自定义 wakanda 模型、代理、阅读器、作家没有加载。我在其他问题中问过 MVC 如何引用类、加载文件和实例化类，仍然有点困惑。
解决方法是向自定义 wakanda 模型和代理添加要求
对于 Wakanda 模型添加要求：['Wakanda.proxy'],
对于 Wakanda 代理添加要求：['Wakanda.reader', 'Wakanda.writer'],
现在继承按预期工作。
【讨论】：
以上是关于ExtJs 4.2 使用 MVC 问题扩展自定义模型的主要内容，如果未能解决你的问题，请参考以下文章
如何在具有嵌套数据的网格中设置组合框值？ Extjs 4.2 Mvc