title: Possible jQuery/jqGrid problem in IE8
body: <p>I have a grid constructed with <code>jqGrid</code>, that uses the search toolbar, a custom formatter to insert <code>radio</code> boxes and a <code>loadComplete</code> handler. 
  Everything works fine in FF but when I go to IE8 (shame!!!) the screen would freeze with the data loaded and the <code>Loading...</code> box on the screen. I can do nothing on the screen. </p>
  
  <p>Here is my code:</p>
  
  <pre><code>function loadCompleteHandler(){
   jQuery("#listTable").jqGrid('setGridHeight', Math.min(300,parseInt(jQuery(".ui-jqgrid-btable").css('height'))));
  }
  
   function radio(value, options, rowObject){
    var radio = '&lt;input type="radio" value=' + value + ' name="radioid" ondblclick="inDetail();"/&gt;';
    return radio;
   }
  
   function statusSelect(){
    #set($select = ":$l10n.lbl_123")
    #foreach($se in $status_list) 
     #set($select = $select + ";$se.getValue():$se.getValue()") 
    #end  
    return "$select";
   }
  
   jQuery(function(){  
    jQuery("#listTable").jqGrid({
       url: '$content.getURI("/servlet/ajax/MyServlet.json")' + '?loggedUserId=$loggedUserId&amp;pageNo=0&amp;locale=' + '$l10n.getLocale().toString()',
       datatype: 'json',
       mtype: 'POST',
       colNames:['','$l10n.lbl_copy','$l10n.lbl_476','$l10n.lbl_380', '$l10n.lbl_2547&lt;br/&gt;$l10n.lbl_3768','$l10n.lbl_owner','$l10n.lbl_256 $l10n.lbl_92','$l10n.lbl_1558&lt;br&gt;$l10n.lbl_185','$l10n.lbl_348'],
       colModel :[ 
          {name:'column1', index:'column1', width:'3%', search:false, align:'center', formatter: radio, editable:false, sortable: false, resizable:false},
          {name:'column2', index:'column2', width:'6%', search:false, align:'center', formatter:'checkbox', sortable: false, resizable:false}, 
          {name:'column3', index:'column3', width:'12%', sortable: false, stype:'select', editoptions:{value: statusSelect()}, resizable:false}, 
          {name:'column4', index:'column4', width:'17%', search:false, sortable: false, resizable:false}, 
          {name:'column5', index:'column5', width:'10%', search:false, sortable: false, resizable:false}, 
          {name:'column6', index:'column6', width:'13%', sortable: false, resizable:false}, 
          {name:'column7', index:'column7', width:'13%', sortable: false, resizable:false},
       {name:'column8', index:'column8', width:'12%', sortable: false, resizable:false},
       {name:'column9', index:'column9', width:'14%', sortable: false, resizable:false}
        ],
       width:'768',
    height: 300,
    loadonce:true,
    pager: '#pagerDiv',
    gridview: true,
    rowNum:15,
    rowTotal: 500,
       sortorder: 'desc',
       viewrecords: true,
    loadComplete: loadCompleteHandler
      }); 
   });
  
   jQuery(function(){
    jQuery("#listTable").jqGrid('filterToolbar',{
         stringResult: true, 
         searchOnEnter: false, 
         defaultSearch:'cn'}); /* search strategy meaning: contains */
   }); 
  </code></pre>
  
  <p>I am using Velocity, jQuery 1.4.2. IE gives an invalid argument error in the jQuery library 
  at this line:</p>
  
  <pre><code> if ( set ) {
     style[ name ] = value;
    }
  </code></pre>
  
  <p>Maybe the problem is with jQuery in IE8, I don't know....</p>
  
  <p><strong>EDIT</strong> : more specific data added</p>
  
  <p>I am using jqGrid 3.8.2. 
  The <code>statusSelect</code> after Velocity has processed it looks like this:</p>
  
  <pre><code>function statusSelect(){
       return ":All;status1:status1;status2:status2";
  }
  </code></pre>
  
  <p>I think there is no problem with the JSON data transfer since the grid previously worked in IE8 when there was no <code>setGridHeight</code>, <code>loadComplete</code> handler. I have also done some minor modifications which I can only partially recount (i.e. column resize disabled).
  For testing purposes here is a JSON object:</p>
  
  <pre><code>    {
      "page":"1",
      "records":2,
      "rows":[{"id":150,"cell":[150,false,"status1","columnData4","columndata5","columndata6","columndata7","Test1\u003cbr/\u003e\u003cspan style\u003d\u0027float:right;\u0027\u003e10.12.2010\u003c/span\u003e","columnData"]},
        {"id":157,"cell":[157,false,"status2","columnData41","columndata51","columnData61","columnData71","Test2\u003cbr/\u003e\u003cspan style\u003d\u0027float:right;\u0027\u003e22.12.2010\u003c/span\u003e","columnData"]}],
      "total":50.0
      }
  </code></pre>
  
  <p>I don't know how to use the total parameter, so I just declared an arbitrary value (50D).
  The inDetail function just submits the form (I am using Apache Turbine parameter here):</p>
  
  <pre><code>    function inDetail(){
          document.forms['myForm'].eventSubmit_doAction.value = 'doSomeAction';
          document.forms['myForm'].submit();
      }
  </code></pre>