title: JSON Object for jqGrid subgrid
body: <p>This is my 3rd question about JSON data for jqGrid's subgrid, till now I did not get a single comment. Please somebody help.</p>
  
  <p>my <a href="https://stackoverflow.com/questions/6647302/subgrid-in-jqgrid">1st question</a><br/>and the 
  <a href="https://stackoverflow.com/questions/6647850/json-string-for-my-jqgrid-subgrid">2nd one</a></p>
  
  <p>I am having trouble getting to know the json format to be used by a subgrid in jqGrid. In my 2nd question i asked about the format that I should be using for a particular scenario </p>
  
  <p>for the given image
  <img src="https://i.stack.imgur.com/rtEhi.jpg" alt="enter image description here"></p>
  
  <p>Is this the proper JSON String?</p>
  
  <pre><code>var myJSONObject = {
  "list": [
      {
          "elementName": "TERM",
          "attribute": [
              {
                  "name": "information",
                  "firstValue": "Required fixes for AIX",
                  "secondValue": "Required fixes for AIX"
              },
              {
                  "name": "name",
                  "firstValue": "PHCO_34",
                  "secondValue": "PHCO_34"
              },
              {
                  "name": "version",
                  "firstValue": "1.0",
                  "secondValue": "2.0"
              }
          ],
          "isEqual": false,
          "isPrasentinXml1": true,
          "isPrasentinXml2": false
      },
      {
          "elementName": "Asian-Core.ASX-JPN-MAN",
          "attribute": [
              {
                  "name": "information",
                  "firstValue": "Man",
                  "secondValue": "Man"
              },
              {
                  "name": "name",
                  "firstValue": "Asian-Core.ASX-JPN-MAN",
                  "secondValue": "Asian-Core.ASX-JPN-MAN"
              },
              {
                  "name": "version",
                  "firstValue": "B.11.23",
                  "secondValue": "B.11.23"
              }
          ],
          "isEqual": false,
          "isPrasentinXml1": true,
          "isPrasentinXml2": true
      }
  ]
  };
  </code></pre>
  
  <p>If yes, my <strong>1st question</strong> this is where i reached so far</p>
  
  <pre><code>$('#compareContent').empty();
      $('&lt;div id="compareParentDiv" width="100%"&gt;')
      .html('&lt;table id="list2" cellspacing="0" cellpadding="0"&gt;&lt;/table&gt;'+
              '&lt;div id="gridpager2"&gt;&lt;/div&gt;&lt;/div&gt;')
      .appendTo('#compareContent');
  
      var grid = jQuery("#list2");
  
      grid.jqGrid({
          datastr : myJSONObject,
          datatype: 'jsonstring',
  
          colNames:['Name','Result1', 'Result2'],
          colModel:[
              {name:'elementName',index:'elementName', width:90},
              {name:'isPrasentinXml1',index:'isPrasentinXml1', width:100},
              {name:'isPrasentinXml2',index:'isPrasentinXml2', width:100},
          ],
          pager : '#gridpager2',
          rowNum:10,
          scrollOffset:0,
          height: 'auto',
  
          autowidth:true,
          viewrecords: true,
          gridview: true,
          jsonReader: { repeatitems : false, root:"list" },
          subGrid: true,
  
          /*subGridModel: [{
              //subgrid columns names
              name: ['Name', 'Version', 'Information'],
              //subgrid columns widths
              width: [200, 100, 100],
              //subrig columns aligns
              align: ['left', 'left', 'left']
  
            }]*/
  
          // define the icons in subgrid
          subGridOptions: {
              "plusicon"  : "ui-icon-triangle-1-e",
              "minusicon" : "ui-icon-triangle-1-s",
              "openicon"  : "ui-icon-arrowreturn-1-e",
              //expand all rows on load
              "expandOnLoad" : true
          },
          subGridRowExpanded: function(subgrid_id, row_id) {
              var subgrid_table_id, pager_id;
              subgrid_table_id = subgrid_id+"_t";
              pager_id = "p_"+subgrid_table_id;
              $("#"+subgrid_id).html("&lt;table id='"+subgrid_table_id+"' class='scroll'&gt;&lt;/table&gt;&lt;div id='"+pager_id+"' class='scroll'&gt;&lt;/div&gt;");
              jQuery("#"+subgrid_table_id).jqGrid({
                  datastr : myJSONObject,
                  datatype: 'jsonstring',
                  colNames: ['Name','Value1','Value2'],
                  colModel: [
                      {name:"name",index:"name",width:90},
                      {name:"firstValue",index:"firstValue",width:100},
                      {name:"secondValue",index:"secondValue",width:100},
                  ],
                  rowNum:20,
                  pager: pager_id,
                  sortname: 'name',
                  sortorder: "asc",
                  height: 'auto',
                  autowidth:true,
                  jsonReader: { repeatitems : false, root:"attribute" }
              });
              jQuery("#"+subgrid_table_id).jqGrid('navGrid',"#"+pager_id,{edit:false,add:false,del:false})
          }
      });
      grid.jqGrid('navGrid','#gridpager2',{add:false,edit:false,del:false});
  </code></pre>
  
  <p>Any type of suggestions/comments/solutions are welcome. Thanks</p>
  
  <p>My output </p>
  
  <p><img src="https://i.stack.imgur.com/UR8bL.jpg" alt="enter image description here"></p>