Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on May 8th, 2012  |  syntax: None  |  size: 2.13 KB  |  hits: 13  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. jqGrid - toolbar/ navigator not show on IE 9?
  2. <!doctype html>
  3. <html>
  4. <head>
  5.     <link rel="stylesheet" type="text/css" href="css/style.css"/>
  6.     <link rel="stylesheet" type="text/css" href="css/ui-lightness/jquery-ui-1.8.16.custom.css"/>
  7.     <link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />
  8.  
  9.     <script type="text/javascript" src="js/jquery.js"></script>
  10.     <script type="text/javascript" src="js/jquery-ui.js"></script>
  11.     <script type="text/javascript" src="js/grid.locale-en.js" ></script>
  12.     <script type="text/javascript" src="js/jquery.jqGrid.min.js" ></script>    
  13. </head>
  14. <body>
  15.     <table id="grid1">
  16.     <div id="pager1"></div>
  17.     </table>
  18.  
  19.     <script type="text/javascript">    
  20.         jQuery("#grid1").jqGrid({
  21.         datatype: "local",
  22.         height: 250,
  23.         pager: '#pager1',
  24.         colNames:['Inv No', 'Client','Notes','Checked?' ],
  25.         colModel:[
  26.         {name:'id',index:'id', width:60, sortable:false},
  27.         {name:'name',index:'name', width:100, sortable:false},
  28.         {name:'note',index:'note', width:150, sortable:false},
  29.         {name:'ind_checked',index:'ind_checked', width:100, sortable:false, align:'center', editable:true,
  30.             edittype:'checkbox', editoptions: { value:"Yes:No" },  formatter:'checkbox'}
  31.         ],
  32.         caption: "Testing" }
  33.         ).navGrid('#pager1');
  34.  
  35.         var mydata = [
  36.         {id:"1",name:"test1",note:"note1",ind_checked:"yes"},
  37.         {id:"2",name:"test2",note:"note2",ind_checked:"No"},
  38.         {id:"3",name:"test3",note:"note3",ind_checked:"No"},
  39.         {id:"4",name:"test4",note:"note4",ind_checked:"yes"},
  40.         {id:"5",name:"test5",note:"note5",ind_checked:"yes"},
  41.         {id:"6",name:"test6",note:"note6",ind_checked:"No"},
  42.         {id:"7",name:"test7",note:"note7",ind_checked:"No"},
  43.         {id:"8",name:"test8",note:"note8",ind_checked:"yes"},
  44.         {id:"9",name:"test9",note:"note9",ind_checked:"No"} ]
  45.         ;
  46.  
  47.         for(var i=0;i<mydata.length;i++) {
  48.             jQuery("#grid1").jqGrid('addRowData',i+1,mydata[i]);
  49.         }
  50.     </script>
  51. </body>
  52. </html>
  53.        
  54. <table id="grid1"></table>
  55. <div id="pager1"></div>