jQuery jQgrid 在表单视图中显示隐藏列
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4645787/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQgrid show hidden column in form view
提问by Robin Maben
jQuery("#CustomerDetailsGrid").jqGrid({
//ignore other properties
colModel: [
{ name: 'AccountNumber', index: 'AccountNumber', hidden: true, viewable: true }
],
viewrecords: true
});
I need to hide the column "Account Number" in grid view but show it in the form view.(Not edit form)
我需要在网格视图中隐藏“帐号”列，但在表单视图中显示它。（不是编辑表单）
回答by zbacsi
The best way is only adding the editrules:{edithidden:true} option.
最好的方法是只添加 editrules:{edithidden:true} 选项。
colModel: [{ name: 'AccountNumber', index: 'AccountNumber', hidden: true, viewable: true,editrules:{edithidden:true} }]
回答by Oleg
If the View dialog will be created it will be filled with the information about every column placed in the rows. The id of the row (the id of <tr>element) will be constructed from the prefix "trv_" and the name of the corresponding column. It it important to understand, that in the form it will be filled the information about allcolumns inclusive hidden columns, but <tr>elements for the hidden columns will be hidden (has style="display: none;"). So to make the information visible it is enough to call jQuery.show()function for the corresponding <tr>element.
如果将创建视图对话框，它将填充有关放置在行中的每一列的信息。行的id（<tr>元素的id ）将由前缀“trv_”和对应列的名称构成。重要的是要理解，在表单中它将填充有关所有列的信息，包括隐藏列，但隐藏列的<tr>元素将被隐藏（具有样式 =“显示：无；”）。因此，为了使信息可见，为jQuery.show()相应的<tr>元素调用函数就足够了。
I prepared the small demowhich demonstrate this. In the demo idcolumn are hidden, but I make the information visible inside of beforeShowFormand afterclickPgButtonsevent handler of the View options:
我准备了演示这一点的小演示。在演示中id列是隐藏的，但我做的信息可见内beforeShowForm和afterclickPgButtons的查看选项事件处理程序：
$("#list").jqGrid('navGrid','#pager',
{add:false,edit:false,del:false,view:true,search:false},
{}, // edit options
{}, // add options
{}, // del options
{}, // search options
{ // vew options
beforeShowForm: function(form) {
$("tr#trv_id",form[0]).show();
},
afterclickPgButtons: function(whichbutton, form, rowid) {
$("tr#trv_id",form[0]).show();
}
});
回答by chris
To follow-up J_'s suggestion, applying the following does the trick:
为了跟进J_的建议，应用以下方法可以解决问题：
editoptions: { dataInit: function(element) { $(element).attr("readonly", "readonly"); } }
Scenario #1:
场景#1：
- Field must be visible in the grid
- Field must be visible in the form
- Field must be read-only
- 字段必须在网格中可见
- 字段必须在表单中可见
- 字段必须是只读的
Solution:
解决方案：
colModel:[
{name:'providerUserId',index:'providerUserId', width:100,editable:true, editrules:{required:true}, editoptions:{ dataInit: function(element) { jq(element).attr("readonly", "readonly"); } }},
],
The providerUserId is visible in the grid and visible when editing the form. But you cannot edit the contents.
providerUserId 在网格中可见，在编辑表单时可见。但您不能编辑内容。
Scenario #2:
场景#2：
- Field must not be visible in the grid
- Field must be visible in the form
- Field must be read-only
- 字段不得在网格中可见
- 字段必须在表单中可见
- 字段必须是只读的
Solution:
解决方案：
colModel:[
{name:'providerUserId',index:'providerUserId', width:100,editable:true, editrules:{required:true, edithidden:true}, hidden:true, editoptions:{ dataInit: function(element) { jq(element).attr("readonly", "readonly"); } }},
]
Notice in both instances I'm using jq to reference jquery, instead of the usual $. In my HTML I have the following script to modify the variable used by jQuery:
请注意，在这两种情况下，我都使用 jq 来引用 jquery，而不是通常的 $。在我的 HTML 中，我有以下脚本来修改 jQuery 使用的变量：
<script type="text/javascript">
var jq = jQuery.noConflict();
</script>
回答by softmage99
To hide the grid column
隐藏网格列
jQuery("#GridId").jqGrid('hideCol','colName');
