JQGrid data is not loading with xml

Question

I have already seen answer of similar question but it couldn't help. The grid is being displayed and even data is being passed but the only problem is its not getting loaded in jqGrid. i checked the response in browser, data is being sent in XML format. So, the only problem is its not getting displayed in browser.

var lastsel2;
            $(function(){ 
                  $("#list1").jqGrid({
                    //url:'process/roles/GetRoles1.php',
                    url: 'processDragonDisplay.php',
                    datatype: 'xml',
                    mtype: 'GET',
                    autowidth: true,
                    height: 'auto',

                    colNames:['name', 'body', 'active_flag','Action'],
                    colModel :[
                      {name:'name', index:'name',   search:true, sortable: true}
                      ,{name:'body', index:'body',  search:true, sortable: true}
                      ,{name:'active_flag', index:'active_flag', width:30, sortable: true}
                      ,{name: 'choice', index: 'choice',width: 50, sortable: false }

                    ],
                    pager: '#pager1',
                    rowNum:10,
                    rowList:[10,20,30],
                    sortname: 'name',
                    sortorder: 'asc',
                    viewrecords: true,
                    gridview: true,
                    caption: 'Templates',
                    editurl: 'processDragonDisplay.php',
                    onSelectRow: function(id) {
                        $('#rowID').html(id);
                        //$('#userId123').attr('value', id);
                        $('#list2').trigger("reloadGrid");
                        if(id && id!==lastsel2){
                            jQuery('#list1').restoreRow(lastsel2);
                            jQuery('#list1').editRow(id,true);
                              lastsel2=id;
                        }
                    },
                    loadComplete: function(){ 
                        var ids = jQuery("#list1").getDataIDs();
                        for(var i=0;i<ids.length;i++){ 
                            var cl = ids[i];
                            ce = "<span class='ui-icon ui-icon-pencil' onclick=editData('"+cl+"');></span>"; 
                            $("#list1").jqGrid('setRowData', ids[i] , { choice: ce });
                        }
                    }
                  }).navGrid("#pager1",{edit:false, add:false, del:true});
                  //$("#list1").jqGrid('inlineNav','#pager1', {edit:false, del: false, add: false});
                });

Response coming with XML data:

<?xml version='1.0' encoding='utf-8'?><rows><page>1</page><total>1</total><records>7</records><row id='A-000002'><cell>foo</cell><cell>bar yes ok</cell><cell>Y</cell><cell></cell></row><row id='A-000009'><cell>hello</cell><cell>hwq</cell><cell>Y</cell><cell></cell></row><row id='A-000013'><cell>nnnnn</cell><cell>nnnn</cell><cell>n</cell><cell></cell></row><row id='A-000007'><cell>t1</cell><cell>Your appointment for TOken  at  for  will be at </cell><cell>Y</cell><cell></cell></row><row id='A-000008'><cell>t1</cell><cell>Your appointment for TOken  at for  will be at </cell><cell>Y</cell><cell></cell></row><row id='A-000011'><cell>test2</cell><cell>test2</cell><cell>n</cell><cell></cell></row><row id='A-000015'><cell>wwwww</cell><cell>wwwww</cell><cell>g</cell><cell></cell></row></rows>

Answer 1

Your XML data has invalid format. Check at some of the examples in the wiki . You must map the XML data with the grid using xmlReader.

For example:

xmlReader: { root:"result", row:"invoice"  }

Would be the mapping to the following data format:

<invoices> 
   <request>true</request> 
   ... 
   <result> 
      <invoice> 
         <cell>data1</cell> 
         <cell>data2</cell> 
         <cell>data3</cell> 
         <cell>data4</cell> 
         <cell>data5</cell> 
         <cell>data6</cell> 
      </invoice> 
      ... 
   </result> 
</invoices>