title: jqGrid: How to dynamically change the value of cell which has formatter
body: <p>I have a jqGrid which has an action column containing the buttons of "edit" and "delete".  The requirement is when the user click the "Delete" button in the action column.  The row is not deleted, but marked to be deleted.  Thus, my implementation is to remove the "edit" button and replace "delete" button with "undeleted" button.  Following are the code</p>
  
  <pre><code> jQuery('#grid').jqGrid({
       datatype: 'local',
       colNames:[
           'action',
            ... other columns
       ],
       colModel:[
          { name:'action', formatter:actionLink, align:'center', sortable:false, width:150},
          ... other columns 
       ],
       height: 'auto',
       width: 935
  });
  
  function actionLink(cellvalue, options, rowObject) {
      var editImg = '&lt;img width="16" height="16" border="0" alt="Edit" src="${contextPath}/images/edit.png"&gt;';
      var deleteImg = '&lt;img width="16" height="16" border="0" alt="Delete" src="${contextPath}/images/delete.png"&gt;';
      var editLink = '&lt;a href="javascript:void(0)" onclick="edit(' + options.rowId + ');"&gt;' + editImg + '&lt;/a&gt;';
      var deleteLink = '&lt;a href="javascript:void(0)" onclick="delete(' + options.rowId + ');"&gt;' + deleteImg + '&lt;/a&gt;';
      return editLink + ' ' + deleteLink;
  }
  
  function delete(rowId) {
     var selectedObj = jQuery('#rid').jqGrid('getRowData', rowId);
     var unDeleteImg = '&lt;img width="16" height="16" border="0" src="${contextPath}/images/arrow_undo.png" /&gt;';
     selectedObj.action = '&lt;a href="javascript:void(0)" onclick="unDelete(' + rowId + ');"&gt;' + unDeleteImg + '&lt;/a&gt;';
     jQuery('#grid').jqGrid('setRowData', rowId, selectedObj);
  }
  </code></pre>
  
  <p>The action column still display "edit" and "delete" buttons rather than just "undo" button.  What did I do wrong?  Is it the problem of formatter function actionLink?</p>