Problems with data source type "array"

[stephanParticipant]

Hi,

I receive my data for the grid in the form of a 2 dimensional array. Example:

myData = [ [1,’AAA’,0.7, ‘XXX’], [2,’BBB’,0.99, ‘YYY’], …]

In other words: it is an array of rows where each row is an array of column data values. How do I use this correctly as the data source for a grid ? Apparently my simple approach of putting it into a data adapter is incorrect and not compatibe with the grid:

    var dataAdapter = new $.jqx.dataAdapter({
      localdata : cgTableData.cgGetData(),
      datatype : "array"
    });

If I use that “dataAdapter” as source for my grid it appears to work a bit, but totally fails when trying to sort grid columns.

What is the best way of using a 2D array as data source for a grid ? Since I do get very large amounts of data in that form I am looking for an efficient solution with as little preparation overhead and as little redundant data storage as possible.

Thanks for your help,
Stephan

[stephanParticipant]

Hi,

What I forgot to explain above: Here is how I initialize the column definitions :

    var colDefs = [];
    for (colIdx = 0; colIdx < headerData.length; colIdx++) {
      column = {
        text : headerData[colIdx].name,
        sortable : true,
      };
      colDefs.push(column);
    }

The resulting ‘colDefs ‘ is what I give to the table as ‘columns’ property. Since my table data is just a 2D array of values the header information is supplied to me in a separate object. The expression “headerData[colIdx].name” gives the name for column “colIdx” as a string.

I’d like to add that the separation of table/grid data into header info object and actual data values array was introduced to save storage space for the data by not having to repeat the column names on every single row.

Regards,
Stephan

[Peter StoevKeymaster]

Hi,

You missed to set and initialize the “datafields” array of the source object. That is a requirement which should not be omitted. Each datafield should have “name” and “type” members.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[stephanParticipant]

Hi once more,

After some searching and testing I found the example in your “Demo” section that actually uses a 2D array exactly the way I use it. As far as I remember I copied my code from that particular demo:
http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm#demos/jqxgrid/jsarray.htm

And with the code from that demo I was also able to reproduce the bug/problem I am encountering. I copied the demo into a fiddle and just added “srtable:true” to the table:
http://jsfiddle.net/_stephan_/wNEAr/

What you should observe is: attempting to sort any column by clicking on the column header will always sort on the first column only. This is exactly the problem I also have in my own application.

Sidenote: I made a quick test where I replaced the 2D array with an array of rows where each row is an object of column values and each column value has as its key the column name (in other words: the is organized exactly as explained here: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm#demos/jqxgrid/bindingtoarray.htm). For such an array the sorting works just fine.

I’d like to add, though, that the later form of array is an extreme waste memory, especially for larger arrays (say >1000 rows with 10 to 20 columns), because it repeats the column names over and over again on each row. Also because my own source data is nto organized like that I would have to reorganize my data which would cause a huge overhead. In the end my application must be capable of dealing withtables that hold >10.000 rows, so performance and efficiency is important to me.

Regards,
Stephan

[Peter StoevKeymaster]

Hi,

As I already written, the Initialization of the datafields array and setting the “name” and “type” of each field is required. The demo that you posted does not include Sorting, Filtering or other operations, but if it was, then the initialization would be much different.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[stephanParticipant]

Hi Peter,

Could you please give me an example of how to correctly set “datafields” for this fiddle (which is a copy of your demo):
http://jsfiddle.net/_stephan_/wNEAr/

Since I derived my code from your Demo, which also has no “datafields”, I guess it would be good idea to add “datafields” to the Demo as well.

Regards,
Stephan

[Peter StoevKeymaster]

Hi,

The demo does not have Sorting/Filtering so it is not necessary there to specify the “type” of each field. So you should have code like that:

   datafields: [{name: 'CompanyName', map: '0', type: 'string'}],
 

and when you initialize a column, to set its “datafield” member to point to the appropriate “name”.

    columns: [{
        text: 'Company Name',
        datafield: 'CompanyName',
        width: 150
    }

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[stephanParticipant]

Hi Peter,

Thanks for the example. I will now add that to my application.

Regards,
Stephan

[stephanParticipant]

Hi,

Just for the sake of completeness, and also in case someone else encounters a similar problem and finds this thread: I have updated the fiddle with the helpful recommendations from Peter:

http://jsfiddle.net/_stephan_/wNEAr/1/

Now the sorting works just fine for all columns.

Regards,
Stephan

[caparomulaParticipant]

Hi,

I’ve got a similar problem, except my data is stored in an array of columns rather than an array of rows:

data: {
c1: [11,12,13,14],
c2: [21,22,23,24]
}

Is it possible for me to access this via a data adapter, or will I have to transpose it to make the following table?

c1 c2
11 21
12 22
13 23
14 24

Thanks,

Chris

[Author]

Posts