如何利用jqGrid表格方法重新设置caption属性值

xiaoxiao2021-02-28  55

1、问题背景

     (1)jqGrid生成表格带有标题,固定不变的

     (2)表格标题随着年份进行变化

2、实现源码

[html]  view plain  copy  print ? <!DOCTYPE html>   <html>       <head>           <meta charset="UTF-8">           <title>如何设置表格caption值</title>           <link rel="stylesheet" href="../css/ui.jqgrid-bootstrap-ui.css" />           <link rel="stylesheet" href="../css/ui.jqgrid-bootstrap.css" />           <link rel="stylesheet" href="../css/ui.jqgrid.css" />           <script src="../js/jquery-1.11.0.min.js"></script>           <script src="../js/jquery.jqGrid.min.js"></script>           <script src="../js/i18n/grid.locale-cn.js"></script>           <script>               $(function(){                   var date = new Date();                   var year = date.getFullYear();                                      var student = [                       {id:'001',name:'zhangsan1',sex:'m',age:23},                       {id:'002',name:'zhangsan2',sex:'w',age:20},                       {id:'003',name:'zhangsan3',sex:'m',age:22},                       {id:'004',name:'zhangsan4',sex:'w',age:21},                       {id:'005',name:'zhangsan5',sex:'m',age:19},                       {id:'006',name:'zhangsan6',sex:'w',age:18},                       {id:'007',name:'zhangsan7',sex:'m',age:24},                       {id:'008',name:'zhangsan8',sex:'w',age:20},                       {id:'009',name:'zhangsan9',sex:'m',age:25},                       {id:'010',name:'zhangsan10',sex:'w',age:23}                   ];                   $("#title-grid-table").jqGrid({                       data:student,                       datatype:'local',                       caption:'学生信息表',                       height:'auto',                       rowNum: 30,                         rowList: [10,20,30],                         colNames:['编号','姓名','性别','年龄'],                       colModel:[                             {name:'id',index:'id', width:300, sorttype:"int"},                             {name:'name',index:'name', width:300,editable:true},                           {name:'sex',index:'sex',width:300},                           {name:'age',index:'age',width:300}                       ],                         pager: "#title-grid-pager",                         viewrecords: true,                         sortname: 'name',                       loadComplete:function(){                           $(this).jqGrid("setCaption",year+"年毕业学生信息表");                       }                   });               });           </script>       </head>       <body>           <div>               <table id="title-grid-table"></table>               <table id="title-grid-pager"></table>           </div>       </body>   </html>   3、问题说明

(1)固定标题属性直接使用caption

(2)重新设置标题的方法是setCaption

转载请注明原文地址: https://www.6miu.com/read-70413.html

最新回复(0)