jQuery UI Widgets Forums Plugins Data Adapter mapping to hierarchical objects by flattening

This topic contains 2 replies, has 2 voices, and was last updated by  badera 8 years, 9 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author

  • badera
    Participant

    Dear all

    I have a JSON Object containing an array of Objects and the Objects itself do contain again an array of objects.
    I like to display this content in a flat way in a jqxGrid and therefore I wonder if I can configure the dataAdapter to do this mapping. According the API-Doc, we can do a lot in the datafield setting of the dataAdatper; however, is it possible to do this?

    My input Object is the following:

    
    {
       "readers":[
          {
             "merchantID":3,
             "id":20,
             "merchant":"Location 1",
             "label":"A179207",
             "state":"ACTIVE",
             "timestampLastActivity":1424176492950,
             "details":[
                {
                   "readerTypeName":"myReader",
                   "id104":"ID104",
                   "id106":"ID106",
                   "configName":"MyConfiguration",
                   "firmwareVersion":"00.09.53-6319",
                   "timestamp":1424176492947
                }
             ]
          },
          {
             "merchantID":3,
             "id":446,
             "merchant":"Location 1",
             "label":"A123091",
             "state":"ACTIVE",
             "timestampLastActivity":1424178336044,
             "details":[
                {
                   "readerTypeName":"myReader",
                   "id104":"ID104_01",
                   "id106":"XY-0091",
                   "configName":"My Configuration 02",
                   "firmwareVersion":"00.09.53-6319",
                   "timestamp":1424178320164
                },
                {
                   "readerTypeName":"myReader",
                   "id104":"ID104_02",
                   "id106":"XY-0015",
                   "configName":"My Configuration 01",
                   "firmwareVersion":"00.09.53-6319",
                   "timestamp":1424178335614
                }
             ]
          }
       ]
    }

    Every ‘readers’ elemenet does contain at least one array member ‘details’. So I like to display a grid with one row per detail, together with the detail’s parent data. Therefore, the dataAdapter should do ‘flattening’; this means in result, we should see three rows, each with a merge of ‘readers’ root elements with their details.

    The resulting array bound to the grid should in this example be:

    [
        {
             "merchantID":3,
             "id":20,
             "merchant":"Location 1",
             "label":"MIC179207",
             "state":"ACTIVE",
             "timestampLastActivity":1424176492950,
             "readerTypeName":"myReader",
             "id104":"ID104",
             "id106":"ID106",
             "configName":"MyConfiguration",
             "firmwareVersion":"00.09.53-6319",
             "timestamp":1424176492947
        },
        {
             "merchantID":3,
             "id":446,
             "merchant":"Location 1",
             "label":"MIC123091",
             "state":"ACTIVE",
             "timestampLastActivity":1424178336044,
             "readerTypeName":"myReader",
             "id104":"ID104_01",
             "id106":"XY-0091",
             "configName":"My Configuration 02",
             "firmwareVersion":"00.09.53-6319",
             "timestamp":1424178320164
        },
        {
             "merchantID":3,
             "id":446,
             "merchant":"Location 1",
             "label":"MIC123091",
             "state":"ACTIVE",
             "timestampLastActivity":1424178336044,
             "readerTypeName":"myReader",
             "id104":"ID104_02",
             "id106":"XY-0015",
             "configName":"My Configuration 01",
             "firmwareVersion":"00.09.53-6319",
             "timestamp":1424178335614
        }
    ]

    Is this possible to configure? Or should I use the ‘beforeLoadComplete’ function to handle this?

    At the end, the column ‘label’ will be display as ‘grouped’ in the grid and I get back the hierarchical view.

    Thanks in advance for your help!
    – badera


    Dimitar
    Participant

    Hello badera,

    If there was only one “details” field per reader, your data could easily be mapped and “flattened”. But, as it is, it would probably be best to manually handle it in beforeLoadComplete.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/


    badera
    Participant

    Thanks Dimitar.

    I do it now like this:

            beforeLoadComplete: function (readers) {
                var records = [];
                readers.forEach(function (reader) {
                    if (angular.isArray(reader.details)) {
                        reader.details.forEach(function (detail) {
                            var record = {};
                            record.label = reader.label;
                            record.id104 = detail.id104;
                            record.timestampLastActivity = reader.timestampLastActivity;
                            record.timestamp = reader.timestamp;
                            record.state = reader.state;
                            record.configName = detail.configName;
                            record.firmwareVersion = detail.firmwareVersion;
                            records.push(record);
                        });
                    }
                });
    
                return records;
            }

    Best regards,
    – badera

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.