Datagrid + data transformations

by psoares

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.0/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.0/dojox/grid/resources/claroGrid.css">
<div id="grid"></div>

CSS

body, html {
    width : 100%;
    height : 100%;
}
#grid {
    width : 300px;
    height : 200px;
}

JavaScript

require([
     "dojo/_base/array",
     "dojox/grid/DataGrid",
     "dojo/store/Memory",
     "dojo/html",
     "dojo/data/ObjectStore",
     "dojo/domReady!"], function (array, DataGrid, Memory, html, ObjectStore) {

     /*set up data store*/
     var memStore = new Memory({
         data: [{
             "strategyid": "1",
                 "strategyname": "AR",
                 "strategycompliantflag": "GROUP_STRATEGY_NA"
         }, {
             "strategyid": "0",
                 "strategyname": "Facilities",
                 "strategycompliantflag": "GROUP_STRATEGY_NA"
         }, {
             "strategyid": "1",
                 "strategyname": "Panel",
                 "strategycompliantflag": "GROUP_STRATEGY_NA"
         }, {
             "strategyid": "0",
                 "strategyname": "Agreem.",
                 "strategycompliantflag": "GROUP_STRATEGY_NA"
         }]
     }),

         layout = array.map(memStore.query(), function (item) {
             return {
                 name: item.strategyname,
                 field: "strategycomplyantflag" + "_" + item.strategyname
             }
         }),

         transformedMemStore = new Memory({
             data: array.map(memStore.query(), function (item) {
                 var obj = {};
                 obj["id"] = item.strategyid;
                 obj["strategycomplyantflag_" + item.strategyname] = item.strategycompliantflag;
                 return obj;
             })
         }),
         
         dataStore = new ObjectStore({
             objectStore : transformedMemStore
         });

     console.log("gridLayout", layout);
     console.log("gridData", transformedMemStore.query());

     /*create a new grid*/
     var grid = new DataGrid({
         store: dataStore,
         structure: layout,
         rowSelector: '0px',
         autoHeight: true,
         autoWidth: true
     }, "grid");

     grid.startup();
 });