即使JQGRID包含数据，它也不会加载下一页

Question

jqgrid正确显示了记录总数以及页面号但没有移动到下一页。在单击下一页时，它显示加载但仍保留在同一页面上。我已经看到很多以前的帖子与此相关但没有得到任何解决方案。我已经尝试了#pager但它也无法正常工作。实际上我无法理解这个jqgrid实际上是如何工作的。下面的图片显示了包含所有记录和页面的jqgrid，但没有移动到下一页。

这是我的代码。

＆＃13;

＆＃13;

<?php require_once 'templates/header.php';?>
<link rel="stylesheet" href="css/jquery-ui-custom.css"/>
<link rel="stylesheet" href="css/ui.jqgrid.css"/>
<style>
.ui-widget{font-family:Arial; color:#fff;}
.ui-jqgrid .ui-jqgrid-hdiv {height:25px;}
.ui-jqgrid .ui-jqgrid-pager {height:40px;}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
  background: #fff !important;font-weight: bold;color:#000;font-size:13px;;}
.ui-widget-content{border: 1px solid #ddd !important;}
.ui-jqgrid tr.jqgrow td{height: 33px !important;}
.ui-jqgrid .ui-jqgrid-htable th div, .ui-jqgrid .ui-jqgrid-htable th,.ui-jqgrid-hdiv{height: 33px !important;}
.ui-jqgrid .ui-jqgrid-resize-ltr{margin: 0px !important;}
#pager2{height: 36px !important;}
input.ui-pg-input {
    font-size: 0.8em;
    height: 33.5px !important;
    margin: 0;
    min-width:50px;
    width:80px !important;
}
.ui-th-column{padding-top:10px !important; }
</style>
<div class="content">
	<div class="container">
    	<div class="row">
    		<h1 class="text_underline">Quiz Results: </h1>
			<br/>
    		<div class="col-xs-12 col-sm-8 col-md-8 col-lg-8">
	     		<table id="list2"></table> 
				<div id="pager2" ></div>
			</div>
     	</div>
    </div>
</div>
<script src="js/jquery-ui-custom.min.js"></script>
<script src='js/grid.locale-en.js'></script>
<script src='js/jquery.jqGrid.min.js'></script>
<script>
	   jQuery("#list2").jqGrid({ 
	   url:'server.php', 
	   datatype: "json",
	   mtype: "GET",
	   colNames:['Quiz No','Category Name', 'Right Answer', 'Wrong Answer','Unanswered'], 
	   colModel:[ {name:'id',index:'id', align:"center"}, 
	   {name:'category_name',index:'category_name', align:"center"}, 
	   {name:'right_answer',index:'right_answer', align:"center"},
	   {name:'wrong_answer',index:'wrong_answer', align:"center"},
       {name:'unanswered',index:'unanswered', align:"center"}	   
	   ],
	   rowNum:10, 
	   rowList:[10,20,30],
	   gridview:true, 
	   pager:'#pager2', 
	   sortname: 'id', 
	   recordpos: 'left',
	   viewrecords: true, 
	   sortorder: "asc", 
	   height: '100%'
	   });
	   
	   
	</script>
	
<?php require_once 'templates/footer.php';?>	

＆＃13;

＆＃13;

＆＃13;

＆＃13;

＆＃13;

<?php
ob_start();
session_start();
require_once 'config.php';

 $db = new Cl_DBclass();
 $user_id = $_SESSION['id'];
 
 $page = $_GET['page']; // get the requested page
 $limit =$_GET['rows']; // get how many rows we want to have into the grid
 $sidx = $_GET['sidx']; // get index row - i.e. user click to sort
 $sord = $_GET['sord']; // get the direction
 if(!$sidx) $sidx =1; // connect to the database
 $result = sqlsrv_query( $db->con, "SELECT COUNT(*) AS count FROM scores where user_id = '$user_id' ");
 $row = sqlsrv_fetch_array($result,SQLSRV_FETCH_ASSOC);
 $count = $row['count'];
 
 if( $count >0 ) { 
 $total_pages = ceil($count/$limit);
 //$total_pages = ceil($count/1);
 } else {
 $total_pages = 0; 
 } if ($page > $total_pages) 
 $page=$total_pages; 
 $start = $limit*$page - $limit; // do not put $limit*($page - 1) 
 $SQL = "SELECT S.*, C.category_name from scores S  LEFT JOIN categories C ON S.category_id = C.id where S.user_id = '5'
		 ORDER BY $sidx $sord
		 OFFSET  $start ROWS 
		 FETCH NEXT $limit-$start ROWS ONLY ";
 $result = sqlsrv_query( $db->con, $SQL ) or die("Couldn t execute query.".sqlsrv_errors($db->con));
 $responce = new stdClass();
 $responce->page = $page;
 $responce->total = $total_pages;
 $responce->records = $count; 
 $i=0;
 while($row = sqlsrv_fetch_array($result,SQLSRV_FETCH_ASSOC)) {
 $responce->rows[$i]['id']=$row['id'];
 $responce->rows[$i]['cell']=array($row['id'],$row['category_name'],$row['right_answer'],$row['wrong_answer'],$row['unanswered']); $i++; 
 } 
 echo json_encode($responce);exit;

＆＃13;

＆＃13;

＆＃13;

server response