Hi to all, I'm pretty new to Dojo and I'm experiencing some problems with grids. I need to show data caught from a DB which sends them in JSON format. It's an array containing a number in the first position, and arrays again in the other positions; client side I just group the arrays in bigger ones through some criteria. Each group represents a data store for a single grid.
My problem is that grids show only question marks, instead of data. Through FireBug I had the following error description:
"this._arrayOfTopLevelItems has no properties"
"TypeError"
"(\"{\\"identifier\\":\\"Id\\",\\"items\\":[{\\"machine_id\\":1,\\"machine_line_id\\":1,\\"machine_name\\":\\"blowing machine\\",\\"machine_xml_file_path\\":\\"/etc/drupal/blower.xml\\",\\"machine_ip_address\\":\\"127.0.0.1\\",\\" ...
I tried to follow many examples, with multiple data model, but I didn't reach my goal
Here is part of the data I get after the dojo.toJson(dataobj) call and my JS code. Thanks in advance for your help.
{"identifier":"Id","items":[{"machine_id":1,"machine_line_id":1,"machine_name":"blowing machine","machine_xml_file_path":"/etc/drupal/blower.xml","machine_ip_address":"127.0.0.1","machine_nominal_speed":20000,"machine_type_id":1,"machine_is_configured":true,"machine_position":1,"machine_image_path":"/prova","machine_port":50000,"machine_driver_path":"/home/clsv/workspace/communicator/Debug/communicator"}... ]}
@import "slm/js/dojo110/dojox/grid/_grid/tundraGrid.css";
@import "slm/js/dojo110/dojo/resources/dojo.css";
@import "slm/js/dojo110/dijit/themes/tundra/tundra.css";
@import "slm/js/dojo110/dijit/themes/tundra/tundra_rtl.css";
@import "slm/js/dojo110/dijit/tests/css/dijitTests.css";
dojo.require("dojo.data.ItemFileReadStore");
dojo.require("dojox.grid.Grid");
dojo.require("dojo.parser");
dojo.require("dojox.grid._data.model");
function handleError(response,xhr)
{
alert("An error has occurred:\nRefresh your page and try again");
console.debug(response);
}
function buildGrid(response,xhr)
{
// we must treat data in order to convert them from string to number, boolean, ...
for (i = 2; i < response.length; i++)
{
response[i]['machine_id'] = Number(response[i]['machine_id']);
response[i]['machine_line_id'] = Number(response[i]['machine_line_id']);
response[i]['machine_nominal_speed'] = Number(response[i]['machine_nominal_speed']);
response[i]['machine_type_id'] = Number(response[i]['machine_type_id']);
response[i]['machine_is_configured'] = "t"?response[i]['machine_is_configured']= true:response[i]['machine_is_configured']= false;
response[i]['machine_position'] = Number(response[i]['machine_position']);
response[i]['machine_port'] = Number(response[i]['machine_port']);
}
// First of all we have to create an array containing machines' data divided by lines
var lines = new Array(); // this array will contain the array of each line
for (i = 1; i <= response[0]; i++) // tried to do it server-side, but a sort of overflow exception was thrown
{
var linedata = new Array(); // this array will contain the data of all machines in one line
for (j = 2; j < response.length; j++) // We start from the third position of response because the previous two are for number of lines and machine types
{
if (response[j]['machine_line_id'] == i) // if the line_id of the machine is the one we are treating
linedata.push(response[j]);
}
lines.push(linedata);
}
for (i = 1; i <= response[0]; i++)
{
//Data
var j = i-1;
var dataobj = {};
dataobj.identifier = 'Id';
dataobj.items = lines[j];
//Store
var store = new dojo.data.ItemFileReadStore({jsId: 'jsonStore',data: dojo.toJson(dataobj)});
//Model
//var model = new dojox.grid.data.Table(null, dojo.toJson(lines[j]));
var model = new dojox.grid.data.DojoData(null, store, {jsId: 'model', query:{ id : '*' },clientSort:true});
//Structure
gridLayout = [
{cells: [[
{ name: 'Id'},
{ name: 'Line id'},
{ name: 'Machine name', styles: 'text-align: center;'},
{ name: 'DDF path', styles: 'text-align: center;'},
{ name: 'IP address', styles: 'text-align: center;'},
{ name: 'Nominal speed', styles: 'text-align: center;'},
{ name: 'Type', styles: 'text-align: center;'},
{ name: 'Is configured', styles: 'text-align: center;'},
{ name: 'Position', styles: 'text-align: center;'},
{ name: 'Image path', styles: 'text-align: center;'},
{ name: 'Port', styles: 'text-align: center;'},
{ name: 'Driver path', styles: 'text-align: center;'},
]]}];
dojo.byId("datacontainer").innerHTML += ".."; // here I add some element to the DOM
//var gridContainer = document.body.appendChild(document.createElement("div"));
var gridContainer = dojo.byId("datacontainer").appendChild(document.createElement("div"));
var str = "grid" + i;
var grid = new dojox.Grid({
id: str,
model: model,
structure: gridLayout,
autoHeight: true,
autoWidth: true
},
gridContainer);
}
grid.startup();
}
var xhrparam = {
url: "initlinemach.php",
load: buildGrid,
error: handleError,
handleAs: "json",
timeout: 4000
};
dojo.xhrGet(xhrparam);

It seems to me that you
It seems to me that you define the wrong identifier. Please try with "identifier":"machine_id". Good luck!
Marius
Nothing happened
Thanks, but nothing happened, it still give me the same error.
Thank you for your time.
Check all your field naming
Besides needing to change
to
as per de-co-de's comment, you will also need to change the query in the DojoData creation to also use machine_id rather than id, and you need to tell your structure which fields correspond to the columns you are defining:
gridLayout = [ {cells: [[ { name: 'Id', field: 'machine_id'}, { name: 'Line id', field: 'machine_line_id'}, ... { name: 'Driver path', field: 'machine_driver_path', styles: 'text-align: center;'}, ]]}];And finally, from other posts on the forums, that trailing comma in your last (Driver Path) cell definition is likely to cause you a problem on IE clients.