jqGrid常用属性和方法介绍 | 您所在的位置:网站首页 › jqgrid隐藏某一列 › jqGrid常用属性和方法介绍 |
jqGrid API中文手册:http://blog.mn886.net/jqGrid/ 一、jqGrid属性: width:Grid的宽度,如果未设置,则宽度应为所有列宽的之和;如果设置了宽度,则每列的宽度将会根据shrinkToFit选项的设置,进行设置。 height : Grid的高度,可以接受数字、%值、auto,默认值为150。shrinkToFit:此选项用于根据width计算每列宽度的算法。默认值为true。如果shrinkToFit为true且设置了width值,则每列宽度会根据width成比例缩放;如果shrinkToFit为false且设置了width值,则每列的宽度不会成比例缩放,而是保持原有设置,而Grid将会有水平滚动条。 autowidth:默认值为false。如果设为true,则Grid的宽度会根据父容器的宽度自动重算。重算仅发生在Grid初始化的阶段;如果当父容器尺寸变化了,同时也需要变化Grid的尺寸的话,则需要在自己的代码中调用setGridWidth方法来完成。 这些属性只能是保证第一次时的宽度,当浏览器大小变化如还想让表格宽度自适应,就需要用jqgrid的方法setGridWidth,它有两个参数:new_width、shr,当第二个参数不设置时会按照shrinkToFit的设置值或默认值,而第一个参数则要设置的新的宽度值,所以可用js实现对浏览器宽度变化的自适应: $(function(){ $(window).resize(function(){ $("#analyDataTab").setGridWidth($(window).width()*0.99); $("#charDataTab").setGridWidth(document.body.clientWidth*0.99); }); });注:这里的百分比可按自己需要来设定,也可直接是浏览器的宽度大小。 rownumWidth:控制序号栏的宽度 rownumbers: true,//序号栏是否显示 rownumWidth: 50,//序号栏宽度viewrecords: true,是否显示总记录数 rowNum:是jqgrid分页时每页记录数,默认是20;如果设置rownum设置为10,不管后台返回记录数是多少,最多只显示10条。如果设置为-1,则显示后台返回的所有记录。 二、jqGrid保持显示垂直滚动条 在IE中记录比较少的时候,默认情况下不显示垂直滚动条,会出现标题行与数据行位置对不齐的情况,通过保持显示垂直滚动条可以解决这个问题。 $( pGridId ).closest(".ui-jqgrid-bdiv").css({ 'overflow-y' : 'scroll' });需要保持水平滚动条,则: $( pGridId ).closest(".ui-jqgrid-bdiv").css({ 'overflow-x' : 'scroll' });三、动态显示隐藏某一列 $("#grid_id").setGridParam().showCol("colname").trigger("reloadGrid"); $("#grid_id").setGridParam().hideCol("colname").trigger("reloadGrid");三、常用方法: $("#gridTable").jqGrid("getGridParam","selrow");//获取选中行的id $.currentIframe().$("#gridTable").jqGrid("getRowData","4028f65d5d1bb627015d1c297ecf0006");//根据选中的行的id获取选中行的数据 //取消所有选中的行: $("jqgridtableid").trigger("reloadGrid"); //设定选中行,可设定多行选中: $("jqgridtableid").jqGrid('setSelection',id1); //获得选中行的ID数组: var ids = $("jqgridtableid").jqGrid('getGridParam','selarrrow'); //获得某单元格的数据: var celldata = $("jqgridtableid").jqGrid('getCell',id,colnum); //获得所有行的ID数组: var ids = $("jqgridtableid").jqGrid('getDataIDs');下面可以获取选择一行的id,如果你选择多行,那下面的id是最后选择的行的id: var id=$(‘#gridTable’).jqGrid(‘getGridParam’,'selrow’); 如果想要获取选择多行的id,那这些id便封装成一个id数组,那可以使用以下: var ids=$(‘#gridTable’).jqGrid(‘getGridParam’,'selarrrow’); 如果想获取选择的行的数据,只要传入rowId即可,如下: var rowData = $(“#gridTable”).jqGrid(‘getRowData’,rowId); 而这个rowData是一个对象,如果要获取选择的行的这个对象的属性值,如name的值,需如下: var rowName=rowData.name; 当然你这个对象得有name这个属性才行。 四、标题栏的checkbox,全选全不选 当在JqGrid表格属性中设置了 multiselect:true,这时会在每一行前面出现checkbox 而在点击栏的checkbox时,表格全选或全部选,这时触发的事件是onSelectAll。 onSelectAll:function(rowids,statue){ //函数里做自己的处理 }; rowids:表示表格的所有行Id,即设置了key=true的那一列的值,如果设置了多列的 key=true,那么只选取第一个 statue:true/false,如果全选则为true,全不选则为false全选的时候需要注意的是,rowids是个数组,当从id再获取行数据时需要循环遍历: onSelectAll:function (rowid,status) { if (status) { for(var i=0,l=rowid.length;i |
CopyRight 2018-2019 实验室设备网 版权所有 |