Search code examples
javascriptjquerybrowserjqgrid

jqGrid - Pager not shown. How to enable it?


I dont know why, but im using jqGrid and pager not show properly. I could show the viewrecords, but pager not. The rest of the table works ok.

Could anybody give me any idea about where is the problem.

My JQGrid is:

jQuery('#report_table').jqGrid({               
     scroll: 'true',               
     url:'getReportTableData.json',                     
     datatype: 'json',             
     height: 400,                   
     width: 800,                    
     colNames:['Futures','Units'],                
     colModel:[
        {name:'Futures',index:'Futures',  width: 150, sortable: false},
        {name:'Units',index:'Units',  width: 150, sortable: false],                
     rowNum:100,                    
     loadonce:'false',               
     shrinkToFit: 'true',              
     mtype: 'POST',                
     pager: '#preport_table',                
     postData: { idReport : '75' }, 
     viewrecords: 'true',            
     loadComplete : function (data) {                        
         if (data.error == 1){                                
             $('#dialog-modal').dialog({                       
                 height: 140, width: 300,  modal: true, title: ' Error ',  
                 buttons: { cerrar : function() { 
                         $(this).dialog('close');                
                     }                                           
                 }                                               
             });                                                 
             $('#dialog-modal').html(msgError(data.msg));    
         }                                                       
     },                                                          
     caption: '',                  
     hidegrid: 'true', 
});   

And the html code is

<table id='report_table'></table> <div id='preport_table' ></div>

Thank you.


Solution

  • You main problem is the scroll: true option. In the documentation of the option you will find the following:

    When enabled, the pager elements are disabled and we can use the vertical scrollbar to load data.

    Moreover your code has some syntax errors which you should fix:

    • the second column of the colModel contain no '}' (see before ']').
    • boolean values should be codded as true and false and not as strings 'true' and 'false' (see scroll: 'true', loadonce:'false', shrinkToFit: 'true', viewrecords: 'true', hidegrid: 'true')