ParamQuery grid support forum
General Category => Help for ParamQuery Grid (free version) => Topic started by: larksys on December 18, 2014, 06:28:45 pm
-
I have a page that renders a PQgrid but it's empty. Dev tools does not show the call to the cfc function to get the data. There are no errors.
<script type="text/javascript">
$(document).ready(function() {
ListUsers=function(em) {
var emid = em.title;
//$('#userslistdiv').html('id-' + emid);
$('#userslistdiv').show();
//var obj = { width:700, height:400, title:"List of Emailer Individuals" };
var colM = [
{ title: "IndivID", width: 100, dataType: "integer" },
{ title: "Lastname", width: 150, dataType: "string" },
{ title: "Firstname", width: 150, dataType: "string" }
];
var dataM = {dataType: "JSON",
location: "remote",
recIndx: "IndivID",
url: "/cfc/basic.cfc?method=getIndivs&EmID=" + emid +"&queryFormat=column",
getData: function (response) {
return { data: response.DATA };
}
}
$("#userslistdiv").pqGrid({ width:700, height:400, title:"List of Emailer Individuals", dataModel: dataM, colModel: colM });
//alert("it worked-" + emid);
};
});
</script>
-
url is not a direct parameter of dataModel in base version.
You have to use getUrl parameter as shown in this tutorial http://paramquery.com/tutorial/php
Reference:
http://paramquery.com/api#option-dataModel-getUrl
-
That fixed that. Thank you. Now I'm getting; TypeError: x is undefined in the pqgrid.js and the "loading" icon stays on the grid.
-
use pqgrid.dev.js instead of pqgrid.min.js to check the stack trace of the error. That would help you locate the cause of error.
post your implementation or create a jsfiddle.
-
TypeError: rowData is undefined
The part of pqgrid_dev.js where the problem is;
do {
var rowObj = data[row],
rowData = rowObj,
rowIndx = row,
hidden = rowData.hidden,
row_str = "";
if (hidden) {
if (row == finalRow) {
break;
}
row++;
continue;
}
if (this.offsetRow == null && rowIndx != null) {
this.offsetRow = (row - rowIndx);
}
this._generateRow(rowData, rowIndx, thisColModel, noColumns, hidearrHS1, offset, const_cls, buffer, objP);
if (SM.scrollTillLastRow) {
}
else {
if (row == finalRow) {
break;
}
row++;
}
}
The implementation is pretty simple. I have a button that has onclick="listusers();
Then pqgrid is rendered in a div named userslistdiv.
Fiddle is not an option because of the included script and css that's only available for download ( no Google API lib).
-
json returned by cfc call is attached
-
have you mentioned dataType in dataModel
http://paramquery.com/api#option-dataModel-dataType
Example:
http://paramquery.com/demos/sorting_remote
-
Sorry, this is the current code;
<script type="text/javascript">
$(document).ready(function() {
ListUsers=function(em) {
var emid = em.title;
//$('#userslistdiv').html('id-' + emid);
$('#userslistdiv').show();
//var obj = { width:700, height:400, title:"List of Emailer Individuals" };
var colM = [
{ title: "IndivID", width: 100, dataType: "integer" },
{ title: "Lastname", width: 150, dataType: "string" },
{ title: "Firstname", width: 150, dataType: "string" }
];
var dataModel = {
location: "remote",
dataType: "JSON",
method: "GET",
getUrl : function () {
return { url: 'cfc/basic.cfc?method=getIndivs&EmID=' + emid};
},
getData: function ( response ) {
return { data: response };
}
}
$("#userslistdiv").pqGrid({ width:700, height:400, title:"List of Emailer Individuals", dataModel: dataModel, colModel: colM });
//alert("it worked-" + emid);
};
});
</script>
-
By looking at your JSON data, your getData callback also needs correction.
getData: function ( response ) {
return { data: response.DATA };
}
If you have constructed JSON data manually on the server side, the keynames in your JSON data also require double quotes e.g. it should be "COLUMNS" and "DATA".
-
I should have seen that. thank you very much.