jqGrid中的隐藏列

max*_*r47 54 javascript jquery jqgrid

有没有办法隐藏jqGrid表中的列,但是在表单编辑器模式对话框中编辑行时,它是否显示为只读?

Bob*_*ich 79

此功能内置于jqGrid中.

按如下方式设置网格功能.

$('#myGrid').jqGrid({
   ...
   colNames: ['Manager', 'Name', 'HiddenSalary'],
   colModel: [               
               { name: 'Manager', editable: true },
               { name: 'Price', editable: true },
               { name: 'HiddenSalary', hidden: true , editable: true, 
                  editrules: {edithidden:true} 
               }
             ],
   ...
};
Run Code Online (Sandbox Code Playgroud)

还可以应用其他编辑规则,但这种基本设置会在网格视图中隐藏经理的工资,但允许在显示编辑表单时进行编辑.


chr*_*ris 38

我只是想扩展queen3的建议,应用以下技巧:

editoptions: { 
              dataInit: function(element) { 
                          $(element).attr("readonly", "readonly"); 
                        } 
             }
Run Code Online (Sandbox Code Playgroud)

场景#1:

  • 字段必须在网格中可见
  • 字段必须在表单中可见
  • 字段必须是只读的

方案:

colModel:[
        {  name:'providerUserId',
               index:'providerUserId', 
               width:100,editable:true, 
               editrules:{required:true}, 
               editoptions:{ 
                            dataInit: function(element) { 
                                  jq(element).attr("readonly", "readonly"); 
                             } 
                           }
            },
],
Run Code Online (Sandbox Code Playgroud)

providerUserId在网格中可见,在编辑表单时可见.但是你无法编辑内容.


场景#2:

  • 字段必须在网格中不可见
  • 字段必须在表单中可见
  • 字段必须是只读的

方案:

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"); 
                          } 
                     }
         },
        ]
Run Code Online (Sandbox Code Playgroud)

请注意,在两个实例中我都使用jq来引用jquery,而不是通常的$.在我的HTML中,我有以下脚本来修改jQuery使用的变量:

<script type="text/javascript">
    var jq = jQuery.noConflict();
</script>
Run Code Online (Sandbox Code Playgroud)


小智 22

您可以使用以下代码隐藏表列.

JQuery("tableName").hideCol("colName");
Run Code Online (Sandbox Code Playgroud)

您可以使用以下代码再次显示它.

JQuery("tableName").showCol("colName");
Run Code Online (Sandbox Code Playgroud)

对于您的问题,您可以调用document.ready()上的hideCol()代码,并且可以在对话框的编辑/单击事件上绑定showCol()代码.


小智 7

这个线程是很老,我想,但在碰到这个问题万一别人绊倒......我不得不从表中的选定行抢的价值,但我不想显示列该行来自.我使用了hideCol,但是和Andy一样,它看起来很麻烦.要修复它(称之为黑客)我只需重新设置网格的宽度.

jQuery(document).ready(function() {

       jQuery("#ItemGrid").jqGrid({ 
                ..., 
                width: 700,
                ...
        }).hideCol('StoreId').setGridWidth(700)
Run Code Online (Sandbox Code Playgroud)

由于我的行宽度自动的,当我重置表的宽度将其重置列宽,但不包括隐藏的一个,所以它们填充在间隙中.