Home/ Questions/Q 7056911
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-28T03:55:24+00:00

I have a simple gird with a navigator (toolbar) as I given below; Firefox,

  • 0

I have a simple gird with a navigator (toolbar) as I given below;
Firefox, Chrome is able to show the toolbar, however, my IE is not. 

<!doctype html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="css/style.css"/>
    <link rel="stylesheet" type="text/css" href="css/ui-lightness/jquery-ui-1.8.16.custom.css"/>
    <link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />

    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jquery-ui.js"></script>
    <script type="text/javascript" src="js/grid.locale-en.js" ></script>
    <script type="text/javascript" src="js/jquery.jqGrid.min.js" ></script>     
</head>
<body>
    <table id="grid1">
    <div id="pager1"></div>
    </table>

    <script type="text/javascript">     
        jQuery("#grid1").jqGrid({ 
        datatype: "local", 
        height: 250, 
        pager: '#pager1',
        colNames:['Inv No', 'Client','Notes','Checked?' ], 
        colModel:[ 
        {name:'id',index:'id', width:60, sortable:false}, 
        {name:'name',index:'name', width:100, sortable:false}, 
        {name:'note',index:'note', width:150, sortable:false}, 
        {name:'ind_checked',index:'ind_checked', width:100, sortable:false, align:'center', editable:true, 
            edittype:'checkbox', editoptions: { value:"Yes:No" },  formatter:'checkbox'}
        ],
        caption: "Testing" }
        ).navGrid('#pager1');

        var mydata = [ 
        {id:"1",name:"test1",note:"note1",ind_checked:"yes"}, 
        {id:"2",name:"test2",note:"note2",ind_checked:"No"}, 
        {id:"3",name:"test3",note:"note3",ind_checked:"No"}, 
        {id:"4",name:"test4",note:"note4",ind_checked:"yes"}, 
        {id:"5",name:"test5",note:"note5",ind_checked:"yes"}, 
        {id:"6",name:"test6",note:"note6",ind_checked:"No"}, 
        {id:"7",name:"test7",note:"note7",ind_checked:"No"}, 
        {id:"8",name:"test8",note:"note8",ind_checked:"yes"}, 
        {id:"9",name:"test9",note:"note9",ind_checked:"No"} ]
        ; 

        for(var i=0;i<mydata.length;i++) {
            jQuery("#grid1").jqGrid('addRowData',i+1,mydata[i]);
        }
    </script>
</body>
</html>

I’m testing them with IE 9, jqGrid 4.3.

Can anyone tell me what I’m missing? any setting in IE gotta change? please advise me, thank you.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The pager-div has to be after not in the table (documentation):

    <table id="grid1"></table>
<div id="pager1"></div>

    Also try this example.

    • 0