Question

I have the following JQ-Grid with a formatter function which returns some HTML as the column value:

jQuery("#list").jqGrid({ 
      url:jsonUrl, 
      datatype: 'json', 
      mtype: 'GET', 
      colNames:['Id', 'Name', 'Phone', 'Action'], 
      colModel :[ 
         {name:'id', index:'id', sortable:true}, 
         {name:'name', index:'name', sortable:true},
         {name:'phone', index:'phone', sortable:false},

         {name:'details', index:'details', sortable: false,
              formatter:function(cellvalue,options,rowObject){
                  return "<p class='trigger'><a href='#'><img src='/images/actions.jpg' /></a></p><div class='toggle_container'><div class='block'><table class='action'><tr><td><a href='#'><img src='/images/open.gif' /></a></td><td><a href='#'><img src='/images/edit.gif' /></a></td><td><a href='#'><img src='/images/delete.gif' /></a></td></tr></table></div></div>"
              }
          }
         ] 

Later on, I try to get all the column / row data and export it to Excel. Is there a feature in JQ-Grid which allows you to export in Excel / PDF (fyi – I am using JSP/JAVA).

When I try to do something like this:

 var mya=new Array();
 mya=$("#list").getDataIDs();  // Get All IDs
 var data=$("#list").getRowData(mya[0]);     // Get First row to get the labels

I get a JavaScript error:

 Message: 'l.p.colModel[...].name' is null or not an object
 URI: http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.1.2/js/jquery.jqGrid.min.js

Answer 1

I think I may have an answer to your problem – or at least a workaround that will suffice. Take a look at the javascript below. This is the approach I use for ripping the data out of the grid:

var sCell;
var aDataIDs = $Grid.getDataIDs();

//Loop through table rows
for (var i = 0; i < aDataIDs.length; i++) {

  try {
    //Get row
    var oRow = $Grid.getRowData(aDataIDs[i]);

  }
  catch (e) {
    //If problem then fall back to this
    for (var j = 0; j < _oJQGUserSettings.aColModel.length; j++) {
      if (j > 0) sb.append('\t'); //Add tab

      //Get cell data
      sCell = $Grid.getCell(aDataIDs[i], _oJQGUserSettings.aColModel[j].name);

      sb.append(sCell);  //Add data
    }
  }

If you bear in mind that sb is a javascript stringbuilder class and _oJQGUserSettings.aColModel is just my encapsulation of the ColModel then this should probably give you what you need in terms of extracting the data from the grid as required. (I then copy it to the clipboard which allows me to paste the contents of the grid straight into Excel – handy!)

I suspect there is a bug in getRowData which is thrown when not all columns are displayed to the user. However I haven’t isolated this for sure as yet.