PDA

View Full Version : Grid is empty even server returns data



mail2nishant
14 Apr 2010, 10:04 AM
I am implementing normal search functionality and on click of search button i need grid populated with creteria. from server side log level i know it returns rows but extjs side store always shows 0 record on alert statement. Probably because of AJAX but it never populates grid. Any idea? Please help.

Here is the code for store and grid.




var searchds = new Ext.data.Store({
proxy: new Ext.data.DWRProxy(HBOGOAssetsService.getDummyData, true),
reader: new Ext.data.ListRangeReader(
{id:'id',totalProperty:'totalSize'}, searchrecordType),
remoteSort: false
});

//create grid
//renderer: renderAssetDetails,

var searchGrid = new xg.GridPanel({
id:'button-grid',
store: searchds,
cm: new xg.ColumnModel([
searchSM,
{id:'id',header: "Id", width: 20, hidden: true, sortable: false, dataIndex: 'id'},
{header: "Title / Description", width: 230, renderer: renderAssetDetails, sortable: true, dataIndex: 'title'},
{header: "Categories", width: 100, sortable: true,renderer: renderCategories, dataIndex: 'categories'},
{header: "Start Date", width: 110, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y g:i a'), dataIndex: 'startDate'},
{header: "End Date", width: 110, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y g:i a'), dataIndex: 'endDate'},
{header: "Status", width: 120, renderer: renderStatus, sortable: true, dataIndex: 'status'}
]),
sm: searchSM,
viewConfig: {
forceFit:true
},

bbar:[
new Ext.PagingToolbar({
pageSize: 20,
store: searchds,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display",
items:[
'-']
})],
listeners: {
render: function(g){
//commit changes
//alert("hello");
this.getSelectionModel().on('rowselect', this.onRowSelect, this);
}
},
onRowSelect: function(sm, rowIdx, r) {
//var desc = r.data.desc;
html = [
' '
];
},
width:985,
height:500,
frame:true,
stripeRows: true,
title:'Search Results for Assets',
iconCls:'icon-grid'
});
searchGrid.render('grid-results');


This is the search form. that has some input field and search & rset button.


var searchrecordType = Ext.data.Record.create([
{name: "id"},
{name: "title", type: "string"},
{name: "categories", type: "string"},
{name: "startdate", type: "date"},
{name: "enddate", type: "date"},
{name: "status", type: "string"}
]);



var searchAssetsTab = new Ext.FormPanel({

// removed stuff here
buttons: [
{
text: 'Search',
handler: function () {
searchAssetsTab.getForm().findField('keywords').setValue(Ext.util.Format.trim(searchAssetsTab.getForm().findField('keywords').getValue()));
var getKeywords = Ext.util.Format.trim(searchAssetsTab.getForm().findField('keywords').getValue());
//alert("Keywords "+getKeywords);
//alert("Service "+searchAssetsTab.getForm().findField('service').getValue());
//alert("status "+searchAssetsTab.getForm().findField('status').getValue());
//alert("categories "+searchAssetsTab.getForm().findField('categories').getValue());
if(searchAssetsTab.getForm().findField('service').getValue() == null || searchAssetsTab.getForm().findField('service').getValue() == ""){
Ext.Msg.alert('Search', 'Please select a Service.');
return;
}

if(searchAssetsTab.getForm().isValid()){
//this.selections.clear();
searchGrid.getGridEl().mask('Searching...', 'x-mask-loading');
searchds.on('beforeload', function() {
searchds.baseParams = {
arg:[getKeywords,
searchAssetsTab.getForm().findField('startdt').getValue(),
searchAssetsTab.getForm().findField('enddt').getValue(),
searchAssetsTab.getForm().findField('service').getValue(),
searchAssetsTab.getForm().findField('status').getValue(),
searchAssetsTab.getForm().findField('categories').getValue()],
viaParam: true
};
});

alert("reloading ");
searchds.load({params:{start:0, limit:20},
arg:[getKeywords,
searchAssetsTab.getForm().findField('startdt').getValue(),
searchAssetsTab.getForm().findField('enddt').getValue(),
searchAssetsTab.getForm().findField('service').getValue(),
searchAssetsTab.getForm().findField('status').getValue(),
searchAssetsTab.getForm().findField('categories').getValue()]});
alert("reloaded "+searchds.getCount());
searchds.on('load', function(){
alert("while reaching next page "+searchds.getCount());
if(searchds.getCount() <= 0){
searchGrid.getGridEl().unmask(true);
Ext.Msg.alert('Results', 'No results found. Please try a new search.');
}else{
searchGrid.getGridEl().unmask(true);
}
});
alert("reloaded "+searchds.getCount());
}


//searchGrid.getStore.load({params:{start:0, limit:20}});
}
},
{
text: 'Reset',
handler: function () {
searchAssetsTab.getForm().reset();
if (searchGrid) {
searchGrid.getStore().removeAll();
}
}
}]
,buttonAlign : 'center'
});


searchAssetsTab.render('grid-form');

mail2nishant
14 Apr 2010, 12:12 PM
Can you please help if any ideas?

I posted a thread in wrong section.

Please check this url. It has all required code.

http://www.extjs.com/forum/showthread.php?96976-Grid-is-empty-even-server-returns-data&p=457867#post457867

Mike Robinson
14 Apr 2010, 12:22 PM
I don't know exactly what the problem is, but I can tell you what the problem is: the JSON packet that's being sent back from the server does not exactly match what the JavaScript code is expecting it to be. Somewhere along the way, the mismatch causes an exception to be thrown within the Store object (or the Proxy object), and to be silently caught by that object ... and to make a long story short, nothing actually gets accepted.

Carefully and methodically examine everything about how your JavaScript code is set up and compare it to exactly what the server is sending. ReMeMbEr ThAt JaVaScRiPt Is CaSe SeNsItIvE!

"This is baseball, not atomic warfare: if you miss, an inch is as bad as a mile."

Sgt.Pepper
15 Apr 2010, 6:28 AM
I checked the URL: Can't make anything useful from it...

15 Apr 2010, 6:34 AM
Merged with your original thread.


Stop posting help related questions in the open discussion.