jQWidgets Forums
jQuery UI Widgets › Forums › Grid › Loader does not show when using virtual paging
Tagged: #jqwidgets-grid, grid, javascript grid, jquery grid
This topic contains 2 replies, has 2 voices, and was last updated by Hristo 6 years, 8 months ago.
-
Author
-
Hi,
I am using virtual mode with paging. Source from ajax.
However, the loader is not show while waiting data return from ajax. How can we do this?var source =
{
datatype: “json”,
datafields: [
{ name: ‘RowNum’, type: ‘int’ }
],
id: ‘RowNum’,
localdata: ‘[{}]’,
totalrecords: 0
};var dataAdapter = new $.jqx.dataAdapter(source);
var rendergridrows = function (params) {
return AjaxApp.getDataFromServer(params.startindex, params.endindex);
}$(“#searchResultGrid”).jqxGrid(
{
width: “100%”,
pagermode: ‘default’,
autoheight: true,
source: dataAdapter,
columnsresize: true,
virtualmode: true,
pageable: true,
rendergridrows: rendergridrows,
altrows: true, autoshowloadelement: true,
columns: [
{ text: ‘No’, datafield: ‘RowNum’, width: “5%” }
]
});continues code above…
var AjaxApp = (function () {
var first = true;var getFormData = function (start_rec, end_rec) {
var params = {};
if (start_rec != null) {
params.sta_rec_num = start_rec;
}
if (end_rec != null) {
params.end_rec_num = end_rec;
}return (params);
};var getDataFromServer = function (startindex, endindex) {
var svr_data = [];
$.ajax({
url: ‘@Request.ApplicationPath/…./doSearch’,
data: getFormData(startindex, endindex),
type: “GET”,
async: false,
dataType: ‘json’,
cache: false,
contentType: “application/json; charset=utf-8”,
success: function (result) {
svr_data = result;
},
error: function (xhr, status, error) {}
});
return svr_data;
}var getTotRec = (function () {
var tot_rec = ‘0’;
$.ajax({
url: ‘@Request.ApplicationPath/…./doGetTotalRec’,
data: getFormData(),
type: “GET”,
async: false,
dataType: ‘json’,
cache: false,
success: function (result) {
tot_rec = result;
},
error: function (xhr, status, error) {}
});
return (tot_rec);
});return {
getTotRec:getTotRec,
getDataFromServer: getDataFromServer
};
}());function refresh()
{
source.totalrecords = AjaxApp.getTotRec();
$(‘#searchResultGrid’).jqxGrid(‘gotopage’, 0);
$(“#searchResultGrid”).jqxGrid(‘updatebounddata’);
}Hello sherlyn,
You could use the
showloadelement
method of the jqxGrid.
Also, bind to thebindingcomplete
event and when it is fired use thehideloadelement
method.Best Regards,
Hristo HristovjQWidgets team
http://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.