jQWidgets Forums
jQuery UI Widgets › Forums › Grid › Filling the grid while scrolling from a webservice
Tagged: datagrid, grid virtual scrolling
This topic contains 3 replies, has 2 voices, and was last updated by Peter Stoev 12 years, 2 months ago.
-
Author
-
Hi Guys,
I’ve got the following problem: I need to fill the grid with data from a webservice while scrolling through the grid.I’ve created the following code:
var url = virtualDirectoryRoot + 'GetPartialData';
var parentResponseRaw;
var reportGrid = $('#jqxgrid');
var columns = [
{ text: 'Id', datafield: 'id', width: 100 },
{ text: 'Name', datafield: 'name', width: 100 },
{ text: 'Created At', datafield: 'CreatedAt', width: 100 },
{ text: 'Official Scenario', datafield: 'OfficialScenario', width: 180 },
];
if(reportJson === null || reportJson === undefined) {
reportJson = this.toJSON(); }var source =
{
datatype: 'json',
type: 'POST',
totalrecords: 1000000,
localdata: {}
};
var dataAdapter = new $.jqx.dataAdapter(source);
reportGrid.jqxGrid({
source: dataAdapter,
columns: columns,
width: 780,
virtualmode: true,
rendergridrows: function(params){
reportGrid.jqxGrid.virtualmode = false;
getData(params.startindex, params.endindex);
}
});
function generateColumns(dataRow){
if(dataRow){
for(var key in dataRow){
columns.push({text: key, datafield: key});
}
}
}
function getData(startIndex, endIndex){
var reportJson = {};
reportJson.startIndex = startIndex;
reportJson.endIndex = endIndex;
$.ajax({
type: 'POST',
dataType: 'json',
url: url,
async: false,
data: JSON.stringify(reportJson),
cache: false,
contentType: 'application/json; charset=utf-8',
error: function(jqXHR, textStatus, errorThrown) {
alert('errorThrown: '+errorThrown);
},
success: function(data, status, xhr) {
source.localdata = data;
//reportGrid.jqxGrid('updatebounddata');
reportGrid.jqxGrid.virtualmode = true;
}
});
};
Do you have an idea what’s wrong with my code?Thanks
WaldemarHi Waldemar,
The “rendergridrows” callback function expects an Array to be returned as demonstrated in this sample: virtualscrolling.htm.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.comHi Peter,
the main problem is that the ajax call is asynchron, so even if I put the ajax call into the rendergridrows, the values aren’t displayed.
rendergridrows: function(params){
//getData(params.startindex, params.endindex);
var reportJson = {};
reportJson.startIndex = startIndex;
reportJson.endIndex = endIndex;
$.ajax({
type: ‘POST’,
dataType: ‘json’,
url: url,
async: false,
data: JSON.stringify(reportJson),
cache: false,
contentType: ‘application/json; charset=utf-8’,
error: function(jqXHR, textStatus, errorThrown) {
alert(‘errorThrown: ‘+errorThrown);
},
success: function(data, status, xhr) {
return data; //data is an array
}
}Isn’t working too.
Hi waldemar,
“return data” in the “success” function will return a value to the “success” function. That will not return value of the “rendergridrows function”.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.