DIR : /home/kozerus/public_html/ko_center/js/jqgrid_demo35/navgrid.html

/home/kozerus/public_html/ko_center/js/jqgrid_demo35

<div style="font-size:12px;">
    This example show navigator.<br/>
    See below for all available options. <br/>
    Note: The data is not saved to the server<br/>
</div>
<br />
<table id="navgrid" class="scroll" cellpadding="0" cellspacing="0"></table>
<div id="pagernav" class="scroll" style="text-align:center;"></div>
<script src="navgrid.js" type="text/javascript"> </script>
<br /><br />
<div style="font-size:12px;">

<b> Description </b>
<br />
This method uses <b>colModel</b> and <b>editurl</b> parameters from jqGrid <br/>
<code>
    Calling:
    jQuery("#grid_id").navGrid(selector,options,pEdit,pAdd,pDel,pSearch );
</code>
<br/>

</XMP>    
<b>Java Scrpt code</b>
<XMP>
jQuery("#navgrid").jqGrid({
   	url:'editing.php?q=1',
	datatype: "xml",
   	colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Closed','Ship via','Notes'],
   	colModel:[
   		{name:'id',index:'id', width:55,editable:false,editoptions:{readonly:true,size:10}},
   		{name:'invdate',index:'invdate', width:80,editable:true,editoptions:{size:10}},
   		{name:'name',index:'name', width:90,editable:true,editoptions:{size:25}},
   		{name:'amount',index:'amount', width:60, align:"right",editable:true,editoptions:{size:10}},
   		{name:'tax',index:'tax', width:60, align:"right",editable:true,editoptions:{size:10}},		
   		{name:'total',index:'total', width:60,align:"right",editable:true,editoptions:{size:10}},
		{name:'closed',index:'closed',width:55,align:'center',editable:true,edittype:"checkbox",editoptions:{value:"Yes:No"}},
		{name:'ship_via',index:'ship_via',width:70, editable: true,edittype:"select",editoptions:{value:"FE:FedEx;TN:TNT"}},
   		{name:'note',index:'note', width:100, sortable:false,editable: true,edittype:"textarea", editoptions:{rows:"2",cols:"20"}}		
   	],
   	rowNum:10,
   	rowList:[10,20,30],
   	imgpath: gridimgpath,
   	pager: jQuery('#pagernav'),
   	sortname: 'id',
    viewrecords: true,
    sortorder: "desc",
    caption:"Navigator Example",
    editurl:"someurl.php",
	height:210
}).navGrid('#pagernav',
{}, //options
{height:280,reloadAfterSubmit:false}, // edit options
{height:280,reloadAfterSubmit:false}, // add options
{reloadAfterSubmit:false}, // del options
{} // search options
);
</XMP>
</div>