为什么我的Ext Grid没有填充数据？
|
我正在提供我使用的代码。
请帮忙...
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\', type:\'string\' },
{ name:\'news_description\', mapping:\'news_description\', type:\'string\' },
{ name:\'news_source\', mapping:\'news_source\', type:\'string\' },
{ name:\'published_on\', mapping:\'published_on\', type:\'date\', dateFormat:\'Y-m-d H:i:s\' },
{ name:\'on_skype\', mapping:\'on_skype\', type:\'string\' },
{ name:\'is_active\', mapping:\'is_active\', type:\'string\' },
{ name:\'updated_at\', mapping:\'updated_at\', type:\'date\', dateFormat:\'Y-m-d H:i:s\' }
]/*,
validations: [{
type: \'length\',
field: \'news_title\',
min: 1
}, {
type: \'length\',
field: \'news_summary\',
min: 1
}, {
type: \'length\',
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\',
fields: [
{ name:\'news_id\', mapping:\'news_id\', type:\'int\' },
{ name:\'news_title\', mapping:\'news_title\', type:\'string\' },
{ name:\'news_summary\', mapping:\'news_summary\', type:\'string\' },
{ name:\'news_description\', mapping:\'news_description\', type:\'string\' },
{ name:\'news_source\', mapping:\'news_source\', type:\'string\' },
{ name:\'published_on\', mapping:\'published_on\', type:\'date\', dateFormat:\'Y-m-d H:i:s\' },
{ name:\'on_skype\', mapping:\'on_skype\', type:\'string\' },
{ name:\'is_active\', mapping:\'is_active\', type:\'string\' },
{ name:\'updated_at\', mapping:\'updated_at\', type:\'date\', 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,
sortable : true,
hideable : true,
dataIndex: \'news_title\'
},
{
text : \'Active\',
width : 75,
sortable : true,
hideable : true,
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\',
align : \'center\',
width : 95,
sortable : true,
hideable : false,
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\',
handler: function(grid, rowIndex, 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\',
handler: function(grid, rowIndex, 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,
height: 350,
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
}
没有找到相关结果
已邀请:
2 个回复
豹芜澈
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\' } }) });掀辟髓观粟