jquery easyui datagrid 加载已有得数据翻页 rownumber不变的解决办法

今天遇见了这么个问题

使用easyui的datagrid加载已经页面上已有的数据时，加载什么的问题，翻页数据也更新，但是rownumber始终是从1到10；

应该有不少同仁都遇见过这个问题，之前度娘始终没找到争取答案，不知道是没有还是度娘不给看，索性自己想了个解决办法；

正常情况下我们都是这么写的：

$("#infoTable").datagrid({ 

        title:"批量查询结果", 

        rownumbers:true, 

        fitColumns:true, 

        pagination:true, 

        data:data.slice(0,10), 

        columns:[

          [ 

            {field:'field1', align:"center", title:"field1Name",width:150},

            {field:'field2', align:"center", title:"field2Name",width:150},

            {field:'field3', align:"center", title:"field3Name",width:150},

            {field:'field4', align:"center", title:"field4Name",width:100},

            {field:'field5', align:"center", title:"field5Name",width:100}

          ] 

        ] 

      });

pager = $("#deviceTable").datagrid("getPager"); 

      pager.pagination({

        total: deviceList.length, 

        onSelectPage:function (pageNo, pageSize) {

          var start = (pageNo - 1) * pageSize; 

          var end = start + pageSize; 

          $("#deviceTable").datagrid("loadData", pageList.slice(start, end)); 

          pager.pagination('refresh', { 

            total:deviceList.length, 

            pageNumber:pageNo 

          }); 

        } 

      });

为了现实row number，会增加一个rownumbers:true, 

如果每次翻页都是请求链接，就不会出现rownumber不变化的情况，但是如果是实用页面上已有的数据，翻页就会出现我所说的问题，

解决方案就是在这个onSelectPage里面做文章，用firebug可以看到row number的值都是放在class为 datagrid-cell-rownumber的div中

那么干脆就直接把这些div拿出来，然后自己算个序号出来，修改div中的值

代码如下

var rowNumbers = $('.datagrid-cell-rownumber');

          $(rowNumbers).each(function(index){

         var row = parseInt($(rowNumbers[index]).html()) + parseInt(start);

          $(rowNumbers[index]).html("");

          $(rowNumbers[index]).html(row);

          });

这样就可以完美解决这个问题，下面是完整的代码

var pager = $("#infoTable").datagrid("getPager"); 

      pager.pagination({ 

        total:data.length, 

        onSelectPage:function (pageNo, pageSize) { 

          var start = (pageNo - 1) * pageSize; 

          var end = start + pageSize; 

          $("#infoTable").datagrid("loadData", data.slice(start, end)); 

          var rowNumbers = $('.datagrid-cell-rownumber');

          $(rowNumbers).each(function(index){

         var row = parseInt($(rowNumbers[index]).html()) + parseInt(start);

          $(rowNumbers[index]).html("");

          $(rowNumbers[index]).html(row);

          });

          pager.pagination('refresh', { 

            total:data.length, 

            pageNumber:pageNo 

          }); 

        } 

      });

注意顺序，先loadData，再去修改row number的值，如果顺序反了，那么你会发现没生效，实际是生效的，只是修改的是前一页数据的序号，

到此问题解决，如果有更好办法的同学，请指教