Loading Grid using DataStore does not work

Suite and Optimus Suite 5
#1

All, I am having difficulty loading the grid using a data store. When I manually .parse the data the grid loads fine but when I use the .sync with a DataStore it does not. Any help is appreciated. Thanks Nick

BTW… I am evaluating the PRO edition.

Here is a snippet of code of initializing my grid, below is commented out code that works and below that is the code that does not.

   // Create a grid object by attaching it to cell "a" of the layout. Attaching an object
       // to another object creates the object being attached all in one step.
       contactsGrid = layout.cells("a").attachGrid();
       contactsGrid.setHeader("Name,Last Name,Email");
       contactsGrid.setInitWidths("100,100,*");
       contactsGrid.setColAlign("left,left,left");
       contactsGrid.setColTypes("ro,ro,ro");
       contactsGrid.setColSorting("str,str,str");
       contactsGrid.setColumnIds("firstName,lastName,email");
       
       // Add filtering to the grid.
       contactsGrid.attachHeader("#text_filter,#text_filter,#text_filter");

       // Initialize the grid.
       contactsGrid.init();

       // THE COMMENTED OUT CODE WORKS AND LOADS THE GRID.
       // Hard code some data.
       //var data = {
       //   rows: [{
       //      id: 1091,
       //      data: ["Nick", "Vujasin", "nick_vujasin@yahoo.com"]
       //   }, {
       //      id: 1092,
       //      data: ["Pete", "Tutera", "pete_tutera@cfd.com"]
       //   }]
       //}

       // Load the data into the grid.
       //contactsGrid.parse(data, "json");

       // THIS DOES NOT WORK AND DOES NOT LOAD THE GRID.
       var myDataStore = new dhtmlXDataStore();
       myDataStore.parse([
	  {"id":"1", "firstName":"Nick", "lastName":"Vujasin","email":"nick_vujasin@yahoo.com"},
	  {"id":"2", "firstName":"Pete", "lastName":"Tutera","email":"pete_tutera@cfd.com"}]);

       contactsGrid.sync(myDataStore);
#2

Unfortunately we cannot reproduce this issue locally. Can you please provide complete demo where we can reproduce it? You can find tutorial how to create complete demo here docs.dhtmlx.com/doku.php?id=othe … leted_demo

#3

Which dhtmlx js files are you loading? Are you loading the dhtmlxdatastore.js?

There’s a patched version here (viewtopic.php?f=19&t=20758) that may help. Load it after dhtmlx.js (if you’re using the full pro suite).

Good luck,
Rob

#4

I’m experiencing the same issue - I’ve just tried the datastore.js from the link and have progressed from nothing being displayed to 21 rows with no data (there are 21 rows in the datastore).

Is there a way to dump the data in a datastore?

Thanks,
Matt

#5

BTW, here’s the two different sets of code I’m using:

strXML= strXML+ "<row>\n"; //strXML= strXML+ "<cell>" + i + "</cell>"; strXML= strXML+ "<cell>" + result.data[i]["Date"] + "</cell>"; strXML= strXML+ "<cell>" + result.data[i]["Account"] + "</cell>"; strXML= strXML+ "<cell>" + result.data[i]["Description"] + "</cell>"; strXML= strXML+ "<cell>" + result.data[i]["Amount"] + "</cell>"; strXML= strXML+ "<cell>" + result.data[i]["Tag_Parent"] + "</cell>"; strXML= strXML+ "<cell>" + result.data[i]["Tag"] + "</cell>"; strXML= strXML+ "</row>\n"; /* dsTransactions.add({ "id": i, "Date": result.data[i]["Date"], "Account": result.data[i]["Account"], "Description": result.data[i]["Description"], "Amount": result.data[i]["Amount"], "Tag_Parent": result.data[i]["Tag_Parent"], "Tag": result.data[i]["Tag"] }); */

It’s within Adobe Air - hence the reference to a result dataset.

Matt

#6

Hi all,

I am having the same problem. below is a reproducable example where no data is displayed i the grid.

[code]

Test

 

[/code]

Any pointers will be greatly appreciated!!

Cheers

#7

Hi, I’m having the same issue.
(But I have to ask, what is the point of having this forum if you don’t post or link to the solution?)
below is the code I’m using. (I am using the latest datastore.js files)
filename is: testJsonFile.json

[{
    "id":"1", "sender":"Sprenger, Dondon", "subject":"Accounts Department", "date":"01/15/2013"
},{
    "id":"2", "sender":"Sprenger, Joe", "subject":"Accounts-Receivable Department", "date":"01/16/2013"
},{
    "id":"3", "sender":"Sprenger, Jack", "subject":"Accounts-Payable Department", "date":"01/16/2013"
}
]

the file using that json file:
Grid_Data.html

[code]

var myData={}; var mail={}; 
    mail = new dhtmlXDataStore({
        url:"testJsonFile.json",
        datatype:"json"
    });
    console.log(mail.data.length)
    var mygrid;
    function doInitGrid(){
        mygrid = new dhtmlXGridObject('mygrid_container');
        mygrid.setImagePath("../dhtmlxGrid/codebase/imgs/");
        mygrid.setHeader("sender,subject,date");
        mygrid.setInitWidths("150,*,150");
        mygrid.setColAlign("left,left,right");
        mygrid.setSkin("light");
        mygrid.init();


        mygrid.sync(mail);
        console.log(mygrid.getRowsNum())

    }
    var loadMailData = function(){
        mygrid.sync(mail);
        var count = mygrid.getRowsNum();
        console.log(count);
        return count;
    }
</script>
<title></title>
[/code]
#8

asark, your code works well for us. please, try to use the attached js files. If issue still occurs - please , provide us with a complete demo where the issue can be reproduced.

jjaeckle, please, try to add:

mygrid.setColumnIds("sender,subject,date")

codebase.zip (37.4 KB)

#9

I did that… and changed the grid header to match, but the grid is still empty.

It’s very strange, this line of code:
console.log(employees.data.length) results in “undefined”
yet the grid has the correct amount of empty lines for the number of records (3 lines).
This line returns 3:
console.log(mygrid.getRowsNum())
So why would the data.length be undefined.

What happens when you try to run this code?

Thanks,

john

data:

[ { "id": "1", "FirstName": "Sprenger", "LastName": "Dondon", "Department": "Accounts Department", "Gender": "Male", "Email": "Dondon_Sprenger@qzqjfpuxkal.org" }, { "id": "2", "FirstName": "Barby", "LastName": "Addinall", "Department": "Human Resources", "Gender": "Female", "Email": "Addinall@ywvl.net" }, { "id": "3", "FirstName": "Ehle", "LastName": "Le-good", "Department": "Accounts Department", "Gender": "Female", "Email": "Ehle_Le-good@yam.net" } ]

[code]

var myData={}; var employees; var mail; 
    employees = new dhtmlXDataStore({
        url:"employees.json",
        datatype:"json"
    });
    console.log(employees.data.length)

    var mygrid;
    function doInitGrid(){
        mygrid = new dhtmlXGridObject('mygrid_container');
        mygrid.setImagePath("js/dhtmlxGrid/codebase/imgs/");
        mygrid.setHeader("sender,subject,date");
        mygrid.setInitWidths("150,*,150");
        mygrid.setColAlign("left,left,right");
        mygrid.setColumnIds("sender,subject,date");
        mygrid.setSkin("light");
        mygrid.init();



        mygrid.sync(employees);
        console.log(mygrid.getRowsNum())

    }

</script>
<title></title>
[/code]
#10

Please, make your data ids correspond to column ids.
Data:

{ "id": "1", "FirstName": "Sprenger", "LastName": "Dondon", "Department": "Accounts Department", "Gender": "Male", "Email": "Dondon_Sprenger@qzqjfpuxkal.org" },
so the ids are: id, FirstName, LastName, Department, Gender, Email

and in the grid:

mygrid.setColumnIds("sender,subject,date");

There are no ids corresponding to your data.

#11

HI, i’ve logged in with a different name. yes, I put in the wrong data file. But when I changed the code to match the data, employees.json. I get the same result with 5 columns rather than three? Were you able to change the column id’s and make it work? Do I have a bad environment?

Thanks,

John

#12

Unfortunately the issue cannot be reconstructed locally.
YOur sample works well for us.
If issue still occurs for you - please, provide us with a complete demo where the issue can be reproduced.
Here you can find a tutorial:
docs.dhtmlx.com/doku.php?id=othe … leted_demo

#13

Doh! Yes they do, I see the problem now!