jqGrid动态显示列,隐藏列，隐藏列并自动设置宽度

最新推荐文章于 2023-06-26 10:49:42 发布
最新推荐文章于 2023-06-26 10:49:42 发布
阅读量8k 收藏 4
点赞数 2
分类专栏： JQuery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/sgrrmswtvt/article/details/83183162
版权 
$("#jqGrid_table").setGridParam().hideCol("列的名字");//隐藏

$("#jqGrid_table").setGridParam().showCol("列的名字");//显示

$("#jqGrid").trigger("reloadGrid");//刷新

$("#jqGrid_table").setGridWidth($(window).width()); //设置宽度
xiaowen5555555
关注
  • 2
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
jqgrid动态显示 隐藏 指定列
夏安的博客
02-24 2万+
一、最笨的方法 来判断 jsp页面 <s:hidden id="sksj" name="sksj" value="%{sksj}"></s:hidden> <s:hidden name="skdd" id="skdd" value="%{skdd}"></s:hidden&g
jQGrid 动态设置字段宽度
驴小孩的爸爸
09-25 1188
if(true){ //设置第八列宽度 // studentTable_name // studentTable为表格Id name为列名 // tr:first-child td:nth-child(8) 每行数据的第八列 $("#studentTable_name").css("width","131"); $("#studentTa...
jqGrid调整宽度
最新发布
qq_38652288的博客
06-26 1186
解决隐藏/展示列后影响表格自适应宽度问题。
jqgrid动态显示隐藏列，同时自动调整表格宽度
玩家六的专栏
02-20 5776
直接上代码： function showHideCol(e) { var colModel = $(grid_selector).jqGrid('getGridParam', 'colModel'); var width = 0;//获取当前列的列宽 for(var i=0;i<colModel.length;i++){ if (colModel[i]["name"]
jqgrid中显示隐藏列
qq_20426717的博客
03-24 696
jQuery("#CheckBox_ZP").change(function () { if ($("#CheckBox_ZP").prop("checked")) { $("#gridTable").setGridParam().showCol("LARGESS_AMOUNT").trigger("reloadGrid"...
jqgrid调整宽度自适应
weixin_34248705的博客
03-20 731
2019独角兽企业重金招聘Python工程师标准>>> ...
jQuery插件jqGrid动态获取列和列字段的方法
10-20
除了基本的获取列信息，还可以结合其他jqGrid的API进行更复杂的操作，如动态添加、删除或隐藏列，或者根据用户的选择改变列的排序顺序。例如，你可以监听复选框的`change`事件，根据被选中的列名更新`colModel`，...
jqgrid序列
08-08
- 初始化jqGrid：使用JavaScript初始化表格，配置各项参数，如数据源、列信息、分页设置等。 - 加载数据：根据配置加载数据，可以是静态数据，也可以是从服务器动态获取的数据。 **2. jqGrid的特性** - 数据处理：...
jqGrid5.3.1(grid，treegrid) 2018官方最新版本
08-24
- **列自定义**：可以自由定义列的显示、隐藏、宽度和对齐方式，甚至可以添加自定义的列模板。 - **搜索与过滤**：提供强大的搜索和过滤功能，支持模糊搜索、多条件组合查询，用户可以快速定位所需数据。 - **...
jqGrid 4.2
12-01
此外，还可以动态添加或隐藏列，以适应不同的需求。 4. **行操作**：jqGrid支持行级别的操作，如行选择、行编辑和行删除。通过单击行或使用行内按钮，用户可以直接进行这些操作。 5. **数据编辑**：提供两种编辑...
JQGrid4.0以上英文API文档
07-15
- **隐藏/显示列**：`hidegrid`控制是否显示隐藏列按钮，`showhide`方法用于显示/隐藏列。 - **自定义列**：通过`formatoptions`和`cellattr`实现列的个性化显示和行为。 **4. 编辑与添加** - **行编辑**：`...
29jqGrid 3.0新特征- 显示/隐藏列
阿甘兄
04-24 1372
这个例子展示了两个新方法: 1.hideCol(colname) - 可以根据一个给出的列名来隐藏一列。 2.showCol(colname) - 可以根据给出的列名来显示一列。 3.当表格在初始化中设置了colModel中的一个新属性hidden的时候，我们可以实现隐藏一列。 例如: {name:‘invdate’,index:‘invdate’, width:90, hidden:true} ...
jqGrid数据列表和表单的列隐藏/显示的小技巧
热门推荐
左北右西
06-07 1万+
最近刚刚使用jqGrid很多地方不是很熟，很多东西在网上查不到，我就用自己笨笨的方法了，有什么地方做得不对的，可以在评论里提出你的意见哟~~ 一、数据列隐藏 实现目标：在数据列表中不显示该列，但是在自带的编辑按钮打开时有该字段。 方法一：简单粗暴在colModel里设置 width:’none’ 。 网上搜到 hidedlg 设置为true的方法并不管用，不知道是不是版本的支持问题，我用的版
jqGrid选中行、格式化、自定义按钮、隐藏
weixin_30336061的博客
08-16 214
获取选择一行的id： var id=$('#jqGrid').jqGrid('getGridParam','selrow'); 获取选择多行的id： var ids=$('#jqGrid').jqGrid('getGridParam','selarrrow'); 获取选择的行的数据 rowId(选择一行的id)： var rowData = $('...
jqGrid 列表数据的一些基本数据操作整理
qq_39822451的博客
08-22 703
//jqGrid 列表数据的基本操作 //获取汇总行数据 　　 var row = $("#yourDataGrid").jqGrid(“footerData”, “get”); //1获取选中行的id数组 var id = $("#yourDataGrid").jqGrid("getGridParam", "selarow"); var ids = $("you...
jqGrid 常用方法和事件
u012216568的博客
03-26 1033
jqGrid 常用方法整理常用方法获取行数据删除行数据重新加载表格动态设置列显示隐藏常用事件 常用方法 获取行数据 <div id='jqGrid'></div> 1、获取所有行数据 $('#jqGrid').getRowData(); --或者 var IDS= $("#jqGrid").getDataIDs(); for(var i=0;i<IDS.length;i++){ var obj = $("#gridTable").getRowData(IDS[i]);
表控制Table Control设置某列隐藏
Buffalo_soldier的博客
11-25 830
表控制是ABAP开发中经常用到的技术，它的字段控制相比ALV更加灵活，适用于一些复杂的应用场景，例如ME23N采购订单的信息显示。 如果对表控制中的某一列字段进行隐藏，我们首先想到的肯定是LOOP SCREEN, 然后设置字段属性ACTIVE=0，可惜这个方法对表控制不奏效。 正确的做法是：修改表控制中COLS的字段可见长度属性。我写了一点简单的代码来测试。 未修改字段属性前，共有3个字段 通过修改表控制中COLS的字段属性隐藏列EBELN，在PBO增加处理MODULE 具体代码如下： MODULE
jqgrid中当前页数据动态搜索，显示隐藏对应行
野蜂的博客
11-22 2504
项目需要，动态搜索数据，因为数据可以一次性一页加载，同时不想增加服务器压力，动态搜索决定放到本地进行。 于是写了下面一段js代码 $(function() { $("#local-dynamic-select").bind('input propertychange', function() { // alert($(this).val()) var searchStr = $(
jQuery怎么动态显示和隐藏datagrid中的某一列
u013106433的专栏
12-11 601
$(function(){     $('#tt').datagrid({       title:'报表统计',       width:1020,       height:400,       url:'',       fitColumns:true,       loadMsg:'正在获取,请稍侯...',       singleSelect:true,
jqgrid 动态设置筛选列 集合数据
06-03
好的，以下是基于 jqGrid 4.15.5 版本的动态设置筛选列集合数据的示例代码及注释： ```javascript // 定义 jqGrid 表格 $("#grid").jqGrid({ url: "data.json", // 数据源 URL datatype: "json", // 数据类型 colModel: [ {name: "id", label: "ID", width: 50}, {name: "name", label: "姓名", width: 100}, {name: "gender", label: "性别", width: 80, stype: "select", searchoptions: {value: ":All;男:男;女:女"}}, // "stype" 表示该列的筛选类型，"searchoptions" 表示该列的筛选选项 {name: "hobby", label: "爱好", width: 150, stype: "select", searchoptions: {value: ":All"}}, // "stype" 表示该列的筛选类型，"searchoptions" 表示该列的筛选选项 {name: "age", label: "年龄", width: 80, stype: "integer", searchoptions: {sopt: ["eq", "ne", "lt", "le", "gt", "ge"]}}, // "sopt" 表示该列的筛选操作符 {name: "email", label: "邮箱", width: 150}, {name: "address", label: "地址", width: 300} ], rowNum: 10, // 每页行数 rowList: [10, 20, 30], // 每页行数选项 pager: "#pager", // 分页控件 ID sortname: "id", // 默认排序列名 sortorder: "asc", // 默认排序方式 viewrecords: true, // 是否显示总记录数 caption: "示例表格" // 表格标题 }); // 动态设置 "hobby" 列的筛选选项 $.ajax({ url: "hobby.json", // 筛选选项数据源 URL dataType: "json", success: function (data) { var options = {}; $.each(data, function (i, item) { options[item.id] = item.name; }); $("#grid").setColProp("hobby", { searchoptions: { value: ":All;" + options // 将集合数据转换为字符串形式 } }); } }); ``` 注释中已经说明了每一部分的作用，简单总结一下： 1. 定义 jqGrid 表格，其中 "hobby" 列的 "stype" 设置为 "select"，表示该列的筛选类型为下拉框，"searchoptions" 设置了该列的筛选选项，下拉框的选项值暂时设置为 ":All"，待后续动态设置。 2. 通过 Ajax 请求获取筛选选项数据源，并将集合数据转换为字符串形式（格式为 "value1:text1;value2:text2;..."），然后动态设置 "hobby" 列的筛选选项。 希望这个示例能够帮到你，如果还有不清楚的地方，可以继续提问哦！
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值