java - jqGrid : show/hide columns while Updating and Inserting data

标签 java javascript jsp servlets jqgrid

我正在使用 JSP 和 Servlet(IDE:Eclipse,数据库:Oracle10)开发 Web 应用程序。我正在使用 jqGrid 以表格格式显示记录。

代码片段:

jQuery("#list10").jqGrid({
        url:'ProfileServ?action=profile',
        datatype: "xml",
        sortable: true,
        height: 250,
        width: 550,
        colNames:['Sr.No.','PROFILE_ID','PROFILE_NAME','TITLE','FIRST_NAME','MIDDLE_NAME','LAST_NAME'], 
        colModel:[{name:'srNo',index:'srNo', width:20,sortable:true, hidden:true},
                          {name:'PROFILE_ID',index:'PROFILE_ID', width:70,sortable:true,editable:true},
                          {name:'PROFILE_NAME',index:'PROFILE_NAME', width:150,sortable:true,editable:true},
                          {name:'TITLE',index:'TITLE', width:200,sortable:false,editable:true, hidden:true},
                          {name:'FIRST_NAME',index:'FIRST_NAME', width:200,sortable:false,editable:true, hidden:true},
                          {name:'MIDDLE_NAME',index:'MIDDLE_NAME', width:200,sortable:false,editable:true, hidden:true},
                          {name:'LAST_NAME',index:'LAST_NAME', width:200,sortable:false,editable:true, hidden:true}],
        rowNum:10,
        rowList:[10,20,50,100],
        pager: '#pager10',
        sortname: 'srNo',
        loadonce:true,
        ignoreCase: true,
        viewrecords: true,
        sortorder: "desc",
        multiselect: false,
        editurl: "ProfileServ?action=profileEdit",
        caption: "Profile",
        }).navGrid('#pager10',{edit:true,add:true,del:true,view:true},
            {modal:true,checkOnUpdate:true,closeOnEscape:true,width:500,closeOnSubmit: true,editurl:'ProfileServ?action=profileEdit',
                beforeShowForm: function(formid){alert('hiu');
                    cm = $('#list10').jqGrid('getColProp',"PROFILE_NAME"); cm.hidden=true;
                    cm = $('#list10').jqGrid('getColProp',"TITLE"); cm.hidden=false;
                    cm = $('#list10').jqGrid('getColProp',"FIRST_NAME"); cm.hidden=false;
                    cm = $('#list10').jqGrid('getColProp',"MIDDLE_NAME"); cm.hidden=false;
                    cm = $('#list10').jqGrid('getColProp',"LAST_NAME"); cm.hidden=false;},recreateForm: true},
            {modal:true,closeOnEscape:true,recreateForm: true,width:500,mtype:'POST', url: 'ProfileServ',editData:{action: 'profileAdd',profileID: function () {return profileID;}},
                beforeShowForm: function(formid){alert('hi');
                    cm = $('#list10').jqGrid('getColProp',"PROFILE_NAME"); cm.hidden=true;
                    cm = $('#list10').jqGrid('getColProp',"PROFILE_ID"); cm.editable=true;
                    cm = $('#list10').jqGrid('getColProp',"TITLE"); cm.hidden=false;
                    cm = $('#list10').jqGrid('getColProp',"FIRST_NAME"); cm.hidden=false;
                    cm = $('#list10').jqGrid('getColProp',"MIDDLE_NAME"); cm.hidden=false;
                    cm = $('#list10').jqGrid('getColProp',"LAST_NAME"); cm.hidden=false;},recreateForm: true},
            {closeOnEscape:true, recreateForm: true,mtype: 'POST',url: 'ProfileServ',delData: {action: 'profileDelete',profileID: function () {return profileID;}},closeOnSubmit: true},
            {closeOnEscape: true, multipleSearch: true, closeAfterSearch: true,width: 700},
            {recreateForm: true,width:700,navkeys: [true,38,40],closeOnEscape:true});

在我的 colModel 4 列中,隐藏,因为我不希望它们以表格格式显示。我想在用户想要插入更新数据时显示这些列。

因此,在我的代码中,我在 beforeShowForm 事件上将这些列属性设置为 cm.hidden=false;。但问题是,当用户想要编辑数据时,他必须单击编辑按钮两次,第一次单击时仅显示两列,这些列未隐藏在 colModel 中,当用户单击两次时编辑按钮,然后显示我设置的字段 cm.hidden=false; 。插入数据时也会发生同样的事情。

我认为我将 recreateForm: true 放置在错误的位置或错误的事件中。

提前致谢。

最佳答案

只需将隐藏行设置为具有以下属性:

editable:true, editrules: {edithidden:true}},

JSfiddle 示例 http://jsfiddle.net/dumbguy5689/9ueDL/4/

关于java - jqGrid : show/hide columns while Updating and Inserting data,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14581978/

相关文章:

javascript - Kendo UI/jQuery 点击事件多次运行

java - jsp中的自动完成文本框

java - 使用 java 中的正则表达式对特定字符串的第一次出现取反。

java - 将文件路径数组转换为文件数组并计算每个文件的大小

java - 自动完成 TextView 并选择一个字符串项目

javascript - Angular promise 不起作用

java - 如何在循环中选取 ASCII 输入文件中的列

javascript - 使用可变过滤器从json对象中删除项目

java - 向所有在线用户广播弹出消息 Java,Jsp

javax.el.MethodNotFoundException : Method not found: JSP