问题描述
|
我正在提供我使用的代码。
请帮忙...
JavaScript部分如下所示:
Ext.define(\'NewsInfo\',{
extend: \'Ext.data.Model\',fields: [
{ name:\'news_id\',mapping:\'news_id\',type:\'int\' },{ name:\'news_title\',mapping:\'news_title\',type:\'string\' },{ name:\'news_summary\',mapping:\'news_summary\',{ name:\'news_description\',mapping:\'news_description\',{ name:\'news_source\',mapping:\'news_source\',{ name:\'published_on\',mapping:\'published_on\',type:\'date\',dateFormat:\'Y-m-d H:i:s\' },{ name:\'on_skype\',mapping:\'on_skype\',{ name:\'is_active\',mapping:\'is_active\',{ name:\'updated_at\',mapping:\'updated_at\',dateFormat:\'Y-m-d H:i:s\' }
]/*,validations: [{
type: \'length\',field: \'news_title\',min: 1
},{
type: \'length\',field: \'news_summary\',field: \'news_description\',min: 1
}]*/
});
store = new Ext.data.JsonStore({
autoLoad: true,model: \'NewsInfo\',sortInfo: { field:\'news_title\',direction:\'ASC\'},idProperty: \'news_id\',remoteSort: true,proxy: new Ext.data.HttpProxy({
url: $this._s_ajax_url + \'/load_news_collection/true\',method: \'POST\'
}),reader: Ext.data.JsonReader({
url: $this._s_ajax_url + \'/load_news_collection/true\',dateFormat:\'Y-m-d H:i:s\' }
],root: \'records\',totalProperty: \'row_count\',successproperty: \'success\'
})
});
var columns = [
{
text : \'News ID\',width : 55,sortable : true,hideable : false,dataIndex: \'news_id\'
},{
text : \'News Sinossi\',width : 235,hideable : true,dataIndex: \'news_title\'
},{
text : \'Active\',width : 75,dataIndex: \'is_active\',align : \'center\',renderer : function (s_val) {
if (s_val == \'YES\')
{
return \'<img src=\"\' + $this.get_skin_url(\'images/icons/tick_circle.png\') + \'\" alt=\"\' + s_val + \'\" title=\"\' + s_val + \'\" />\';
}
return \'<img src=\"\' + $this.get_skin_url(\'images/icons/cross_circle.png\') + \'\" alt=\"\' + s_val + \'\" title=\"\' + s_val + \'\" />\';
}
},{
text : \'Last Updated\',width : 95,renderer : Ext.util.Format.dateRenderer(\'d-M-Y\'),dataIndex: \'updated_at\'
},{
xtype : \'actioncolumn\',align : \'center\',hideable: false,width : 70,items : [{
icon : $this.get_skin_url(\'images/icons/pencil.png\'),// Use a URL in the icon config
tooltip: \'Edit\',handler: function(grid,rowIndex,colIndex) {
var obj_rec = store.getAt(rowIndex);
$(\'#div_news_grid_container\').slideUp(800);
$(\'#div_editor_content\').slideDown(800,function () {
$(\'#news_id\').val(obj_rec.get(\'news_id\'));
$(\'#news_title\').val(obj_rec.get(\'news_title\'));
$(\'#news_summary\').val(obj_rec.get(\'news_summary\'));
tinyMCE.get(\'news_description\').setContent(obj_rec.get(\'news_description\'));
});
}
},{
icon : $this.get_skin_url(\'images/icons/view.png\'),// Use a URL in the icon config
tooltip: \'View\',colIndex) {
var obj_rec = store.getAt(rowIndex);
var s_description = \"<div style=\\\"background-color:white !important; height:100%; overflow:auto;\\\">\\
\" + obj_rec.get(\'news_description\') + \"\\
</div>\";
var s_description_html = \"<div style=\\\"background-color:white !important; height:100%; overflow:auto;\\\">\\
<pre>\\
\" + obj_rec.get(\'description_html\') + \"\\
</pre>\\
</div>\";
Ext.create(\'Ext.window.Window\',{
renderTo: \"main-content\",title: \"Description for \" + obj_rec.get(\'title_text\'),closeAction: \'hide\',minimizable: false,maximizable: false,resizable: true,modal: true,layout: \'border\',height: 350,width: 550,items: [{
region: \'center\',xtype: \'tabpanel\',items: [{
title: \'Preview\',html: s_description
},{
title: \'HTML\',html: s_description_html
}]
}]
}).show();
}
},{
icon : $this.get_skin_url(\'images/icons/cross.png\'),// Use a URL in the icon config
tooltip: \'Delete\',colIndex) {
var obj_rec = store.getAt(rowIndex);
var s_news_title = obj_rec.get(\'title_text\');
var i_news_id = obj_rec.get(\'news_id\');
Ext.MessageBox.show({
title:\'Confirm Delete\',msg: \'Do you really want to remove \' + s_news_title + \'?\',buttons: Ext.MessageBox.YESNO,icon: Ext.MessageBox.QUESTION,closable: false,fn: function (btn) {
if (btn == \'yes\')
{
$this.delete_news(i_news_id);
}
}
});
}
}]
}
];
store.on(\'load\',function () {
Ext.create(\'Ext.grid.Panel\',{
store: store,columns: columns,width: 645,title: \'News Management System\',renderTo: \'div_news_grid\',loadMask: true,viewConfig: {
stripeRows: true
},bbar: new Ext.PagingToolbar({
pageSize: 25,store: store,displayInfo: true,displayMsg: \'displaying topics {0} - {1} of {2}\',emptyMsg: \"No topics to display\",items:[
\'-\',/*{
pressed: true,enabletoggle:true,text: \'Show Preview\',cls: \'x-btn-text-icon details\',toggleHandler: function(btn,pressed){
var view = grid.getView();
view.showPreview = pressed;
view.refresh();
}
}*/]
})
});
});
服务器响应以下内容:
{
\"records\":[
{
\"news_id\":\"1\",\"news_title\":\"comunicato\",\"news_summary\":\"Un corso di lingua da seguire sempre,anche fuori sede Un problema che si riscontra frequentemente nelle\",\"news_description\":\"<p> <\\/p>\\r\\n <p>L\\u2019estate \\u00e8 alle porte e desideriamo aggiornarvi sulle attivit\\u00e0 che stiamo organizzando per voi:<\\/p>\\r\\n <p> <\\/p>\\r\\n <p>Per i bambini e i ragazzi dai 4 ai 19 anni proponiamo un programma ricco di giochi,attivit\\u00e0 pratiche,laboratori e tanto divertimento! Un\\u2019occasione in pi\\u00f9 per mettere in pratica le conoscenze linguistiche in un contesto diverso da quello prettamente scolastico favorendo anche il lavoro di gruppo.<\\/p>\\r\\n <ul class=\\\"list01\\\">\\r\\n <li>Si pu\\u00f2 scegliere di fare 1 o 2 settimane<\\/li>\\r\\n <li>I corsi si svolgono dal 13 giugno al 1 luglio (7 \\u2013 19 anni) e dal 4 al 15 luglio (4 \\u2013 6 anni),dal luned\\u00ec al venerd\\u00ec,dalle 8.30 alle 12.30<\\/li>\\r\\n <li>2 settimane: \\u20ac 280,00<\\/li>\\r\\n <li>1 settimana: \\u20ac 150,00<\\/li>\\r\\n <li>I gruppi verranno attivati al raggiungimento di minimo 5 partecipanti e massimo 10<\\/li>\\r\\n <li>Al raggiungimento di 10 partecipanti ci sar\\u00e0 uno sconto del 20% per ogni studente,quindi se avete amici o parenti interessati avvertiteli!<\\/li>\\r\\n <li>Sar\\u00e0 disponibile un servizio di pre e post accoglienza <\\/li>\\r\\n <\\/ul>\\r\\n <p>Infine vi ricordiamo che la scuola rester\\u00e0 aperta per tutta l\\u2019estate (eccetto dal 1 al 22 agosto) per lezioni individuali,recupero crediti scolastici e mini-gruppi.<\\/p>\\r\\n <p> <\\/p>\",\"is_active\":\"YES\",\"published_on\":\"2011-03-01 15:53:36\",\"updated_at\":\"2011-05-25 20:19:12\"
}
],\"row_count\":1,\"success\":true
}
解决方法
这是用extjs4标记的,所以我认为这可能只是更改对象配置以匹配新的配置选项的问题:
您在商店中同时定义了字段和模型。您只需要模型。
idProperty现在已定义为模型的一部分,您已经在商店中拥有它
阅读器现在已定义为代理的一部分,您可以在商店中购买
专门商店类型已弃用(或至少未记录)
您的autoLoad可能会在注册on(\'load \')之前完成。
sortInfo应该定义为排序器
我强烈建议您始终参考官方API来确定“适当的”配置。对于商店:http://docs.sencha.com/ext-js/4-0/#/api/Ext.data.Store
这是代码的修改(但未经测试)版本,其中包含要进行的更改的示例:
Ext.define(\'NewsInfo\',{
extend: \'Ext.data.Model\',idProperty: \'news_id\',// The rest of this should be right
});
存储配置非常不同,并且可能是未加载数据的根源:
var store = new Ext.data.Store({
autoLoad: {
callback: function() {
Ext.create(\'Ext.grid.Panel\',{
// The rest of this should be right,too,pulled up from listener
});
}
},model: \'NewsInfo\',sorters: [{ property:\'news_title\',direction:\'ASC\'}],remoteSort: true,proxy: {
type: \'ajax\',url: $this._s_ajax_url + \'/load_news_collection/true\',method: \'POST\',reader: {
type: \'json\',root: \'records\',totalProperty: \'row_count\',successProperty: \'success\'
}
})
});
,我终于找到了我的问题,它不是json版本。
这似乎很愚蠢,但是我在桌面上本地工作,并且正在对服务器(www.domain.com/json.php)发出Json请求。
您可以创建界面而无需在服务器上。但是,如果您使用表格并提交。
您的网站也必须在服务器上。