jQuery Grid Plugin - jqGridForum

Topic RSS

Grid with local array of custom objects

20/06/2012
00:33

pepbr

Sao Paulo Brazil

New Member

Members

Forum Posts: 2

Member Since:
20/06/2012

Offline

Hello.

First of all I would like to express my deep appreciation to the grid plugin. I am a regular user.

But this time I am facing a new and challenging situation: my grid is using only LOCAL DATA.

I spent hours searching the net for a solution but I simply can't put it together, then I decided to post my question.

I am reading a database and creating a custom javascript object out of its rows. This array is being used by some other codes to display information on a map (using Google Maps api).

Someone requested the data should also be displayed on a table and then here I am, trying to populate my grid with the current loaded array of objects.

The grid columns are defined by this:

colModel:[
                  {name:'id',index:'id', width:50, editable:false},
                  {name:'vehicle',index:'vehicle', width:110, editable:false},
                  {name:'select',index:'select', width:30, editable:false}, //will be used to select rows

]

The array of objects is accessed by:

mvs.getVehicles();

And the values for each column relies in:

var v = mvs.getVehicles[x];

column ID is v.devid

column Vehicle is v.name

Please shed some light on me.

Thanks a million,

Paulo Pedroso

22/06/2012
08:58

Pradeep Reddy Billa

Warangal

New Member

Members

Forum Posts: 2

Member Since:
14/06/2012

Offline

Try adding data as row by row from a Json object..

Somethign like this :

for (var i = 0; i <= mydata.length; i++)

$("#" + gridName).jqGrid('addRowData', i + 1, mydata[i]);

where mydata is a json obect contains the data.

Cheers,

Pradeep Reddy Billa

22/06/2012
15:27

pepbr

Sao Paulo Brazil

New Member

Members

Forum Posts: 2

Member Since:
20/06/2012

Offline

Hi Pradeep.

I forgot to mention I am trying to find a way to do this without adding row by row. I found a way that is working for me so far and this involves transforming by object back to Json. I wonder if there's a way to map the columns to some data.

Here is what I did:

I am using this library to convert my object back to Json:

https://github.com/douglascrockford/JSON-js/blob/master/json2.js

Then I had to add a prototype to my objecy like this (right now I am using just a few fields and not diggin into other objects in my object):

Vehicle.prototype.toJSON = function (key) {
           var returnObj = new Object();
           returnObj.devid = this.devid;
           returnObj.name = this.name;
           returnObj.speed = this.speed;
           returnObj.status = this.status;
           returnObj.distanceToAddress = parseFloat(this.distanceToAddress);   //Google Maps stuff
           returnObj.distanceAsString = this.distanceAsString; //Google Maps stuff
           return returnObj;
       }

By doing this I am telling the json2 how to build json out of my object.

Then, to generate the json:

vehiclesJson = "{\"vehicles\":" + JSON.stringify(this.vehicles) + "}";

And my grid setup become like this:

.jqGrid({
       datastr: vehiclesJson,
       datatype: "jsonstring",
       jsonReader : {
             root: "vehicles",
             page: function(obj){return 1;},
             total: function(obj){return 1;},
             records: function(mvs){return mvs.vehicles.length},
             repeatitems: false,
             cell: "cell",
             id: "devid",
           },

This is how I managed it to work out fine. But I wonder if there's a way to accomplish the same result without converting the object back to json.

Thanks,

Paulo

All RSS

Forum Timezone: Europe/Sofia

Most Users Ever Online: 994

Currently Online:
18 Guest(s)

Currently Browsing this Page:
1 Guest(s)