I'm having an annoying problem with jqGrid: Instead of scrolling the lines, it just keeps adding them one bellow the other and doesn't stop at a certain height. What am I doing wrong? :S
<head>
<link rel="stylesheet" type="text/css" media="screen" href="libraries/jquery/custom-theme/jquery-ui.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="libraries/jquery/jqGrid/css/ui.jqgrid.css?" />
<script type="text/javascript" src="libraries/jquery/jquery.js"></script>
<script type="text/javascript" src="libraries/jquery/jquery-ui.custom.min.js"></script>
<script src="libraries/jquery/jqGrid/js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="libraries/jquery/jqGrid/js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
jQuery("#list4").jqGrid(
{
datatype: "local",
height: 350,
colNames:['Inv No','Date'],
colModel:[
{name:'id',index:'id', width:60, sorttype:"int"},
{name:'invdate',index:'invdate', width:90, sorttype:"date"}
],
multiselect: true,
pager: '#pager5',
caption: "Manipulating Array Data" }).navGrid("#pager5",{edit:false,add:false,del:false});
var mydata = [
{id:"1",invdate:"2007-10-01"},
...
{id:"39",invdate:"2007-09-01"}
];
for(var i=0;i<=mydata.length;i++) jQuery("#list4").jqGrid('addRowData',i+1,mydata[i]);
});
</script>
</head>
<body>
<table id="list4"></table>
<div id="pager5"></div>
</body>