ParamQuery grid support forum
General Category => Help for ParamQuery Pro => Topic started by: resolvecomputing on May 02, 2018, 07:53:35 pm
-
I am developing a screen using gridview, the query returned the results as JSON in few microseconds but loading into the grid takes a long time. The table that is being queried has around 2500 rows. What could be the possible reason for such behavior?
-
If you are using version older than 5, then please enable virtual mode
virtualX: true and virtualY: true
-
Now i using ParamQuery 5
This is my setting.Can you check and tell me something wrong. Thanks!
height: 'flex',
height: ClHeight,
resizable: false,
virtualX: true, virtualY: true,
title: tran('adjustment'),
rowBorders: false,
rowHt: 20,
toggle: function( event, ui ) {
if (ui.state == 'max') {
$('#'+ event.target.id).css('top', '34px');
}
},
filterModel: {
on: true,
mode: "AND",
header: true
},
swipeModel: {
on: 'touch'
},
treeModel: {
dataIndx: 'chart_of_account_name',
chk_dataIndx: 'state',
cascade: true,
checkbox: function(rd) {
return !(rd.variance == undefined) && !(rd.variance == 0);
},
render: function (ui) {
if (ui.rowData.variance == undefined) {
var checked = ui.rowData.state?"checked":"";
return {
text: "<input type='checkbox' checked " + checked +" disabled style='width:18px;'/>" + ui.rowData.chart_of_account_name
};
} else if(ui.rowData.variance == 0) {
return {
text: "<input type='checkbox' checked "+ checked +" disabled style='width:18px;'/>" + ui.rowData.chart_of_account_name
};
}
}
},
sortModel: {
ignoreCase: true
},
scrollModel: {
autoFit: true
},
colModel: [{
dataIndx: 'chart_of_account_name',
title: dbtran('chart_of_account_name'),
exportRender: true,
filter: {
type: 'textbox',
attr: 'autocomplete="off"',
condition: "contain",
listener: 'keyup'
},
editable: false
},
{
dataIndx: 'chart_of_account_code',
title: dbtran('chart_of_account_code'),
align: 'center',
filter: {
type: 'textbox',
attr: 'autocomplete="off"',
condition: "contain",
listener: 'keyup'
},
maxWidth: 150,
width: 150,
editable: false
},{
dataIndx: 'currency_iso',
title: dbtran('currency_iso'),
align: 'center',
maxWidth: 60,
width: 60,
editable: false
}, {
dataIndx: 'calculate_ledger_balance',
title: dbtran('calculate_ledger_balance'),
dataType: 'float',
format: '#,###.00',
maxWidth: 150,
width: 100,
align: 'right',
editable: false,
summary: {
type: "sum"
}
}, {
dataIndx: 'closing_balance',
title: dbtran('closing_balance'),
dataType: 'float',
format: '#,###.00',
maxWidth: 150,
width: 100,
align: 'right',
editable: false,
summary: {
type: "sum"
},
render: function (ui) {
// if (ui.rowData.ledger_balance != undefined && ui.rowData.ledger_balance.length > 0) {
return {closing_balance: 1000};
// }
}
}, {
dataIndx: 'variance',
title: dbtran('variance'),
dataType: 'float',
format: '#,###.00',
maxWidth: 150,
width: 100,
align: 'right',
editable: false,
summary: {
type: "sum"
}
}],
dataModel: {
location: "remote",
dataType: "JSON",
method: "GET",
url: "/adjustments/chartofaccounts?report_date=" + reportDate,
getData: function (res) {
return {data: res};
}
},
groupModel: groupModel
-
1. What's the value of ClHeight? If it's too large, it may slow down the rendering of grid.
Please use inbuilt scrolling of the grid by defining small value of height/ maxHeight options to limit the number of rows displayed in the scrollable viewport.
2. If you don't need auto height of rows, then set autoRow: false, it also helps improve rendering performance.
https://paramquery.com/pro/api#option-autoRow
-
1. the ClHeight is available calculate screen's height.
2. I found the reason why it's slow, When i try to render with small data, it works well. But when i try with big data and setting "checkbox: true" or do some condition with checkbox function, it becomes hanging. Can you try simple treeGrid with big JSON which have more than 2000 objects and setting "checkbox : true" then see what is result. I don't know how checkbox function works.
Thanks!
-
I have a recordset of ~5000 rows in treegrid with lazy loading. I've added checkbox: true with cascade: true, but performance is not a problem understandably due to lazy loading.
You can also try lazy loading.
Or if you can share your json data / jsfiddle that would be great to do insitu profiling of the code.