繁体   English   中英

jQuery jqGrid内联编辑-取消行编辑会删除行吗?

[英]jQuery jqGrid Inline Editing - Cancel row edit deletes the row?

我的jqGrid实际上有问题,在网上找不到任何类似的问题。 抱歉,也许我没有写标签。

好吧,让我们开始谈论真正的问题。 我正在使用内联编辑,并且对按钮做了一些自定义。 我想使用“ ENTER”和“ ESC”键作为快捷方式。 这很好。 我正在本地处理网格中的数据,并且只有当用户按下专用按钮时,我才会将数据保存在文件中。 该文件也用于填充网格。 因此,如果用户现在正在编辑网格中不在我的文件中的任何行,并且他通过按ESC取消编辑,则整个数据行将被删除。

有人可以帮助我吗? 我的网格:

        // Table
        jQuery("#tbl").tableDnD({scrollAmount:0});       
        jQuery("#tbl").jqGrid({
            url:'../path/to/my/script.pl', 
            datatype: "json", 
            postData:{'art':'empfang'},
            jsonReader: {
                repeatitems: false
            },
            colNames:['1','2','3','4','5'], 
            colModel:
            [ 
                {name:'1',index:'1', width:200, align:"left", sortable:true,editable:true, edittype:"text"},
                {name:'2',index:'2', width:200, align:"left", sortable:true,editable:true, edittype:"select",editoptions:{value:b}}, 
                {name:'3',index:'3', width:200, align:"left", sortable:true,editable:true, edittype:"text"}, 
                {name:'4',index:'4', width:220, align:"left", sortable:true,editable:true, edittype:"select",editoptions:{value:""}}, 
                {name:'5',index:'5', width:200, align:"left",sortable:true,editable:true, edittype:"select",editoptions:{value:""}}
            ],  
            rowNum:2000, 
            rowTotal: 2000,
            loadtext: 'Reading data...',
            height: '100%',
            width: '100%',
            hidegrid: false,
            sortable: true,
            toppager: true,
            gridview: true, 
            viewrecords: true,
            rownumbers: true, 
            loadonce: true,
            editurl: 'dummy.php',
            pager: '#tbl_toppager',
            loadComplete: function(data){
                $("#tbl").setColProp('4', { editoptions: { value: data.userdata.4} });
                $("#tbl").setColProp('5', { editoptions: { value: data.userdata.directory_listing} });
            },
            gridComplete: function() { 
                $("#_empty","#tbl").addClass("nodrag nodrop"); 
                jQuery("#tbl").tableDnDUpdate(); 
            },
            caption: "Testgrid",
            ondblClickRow: function(id){
                jQuery('#tbl').editRow(id, true); 
            }
        });     

        jQuery("#tbl").jqGrid('filterToolbar');
        jQuery("#tbl").jqGrid(
            'navGrid',
            '#tbl_toppager',
            {
                del: true,
                add: false,
                edit: false,
                refresh: false,
                search: true
            },
            {
            }, // edit options 
            {
            }, // add options 
            {
                reloadAfterSubmit: false,
                jqModal: true,
                closeOnEscape: true
            }, // del options 
            {
                jqModal: true,
                closeOnEscape: true
            } // search options 
        );
        jQuery("#tbl").jqGrid(
            'inlineNav',
            '#tbl_toppager', 
            {
                editParams: { keys: true },
                addParams: { addRowParams: { keys: true } }
            }
        ); // Inline Editing

        jQuery("#tbl_toppager_right").hide();
        jQuery("#tbl_toppager_center").hide();
        jQuery("#tbl").navSeparatorAdd(
            "#tbl_toppager_left",
            {
                sepclass : "ui-separator",
                sepcontent:""
            }
        ).jqGrid(
            'navButtonAdd',
            '#tbl_toppager_left',
            {
                caption: "",
                buttonicon: "ui-icon-document",
                title: "Save data in file",
                position: "last",
                onClickButton: function () {
                    $("#write_file").dialog('open');
                }
            }
        );

感谢您的建议。 问候。

在JQGrid的官方演示中,他们提供了一个示例,该示例执行的操作几乎与您要求的相同

...
onSelectRow: function(id){
                 if(id && id!==lastsel){
                     jQuery('#rowed3').jqGrid('restoreRow',lastsel);   
                     jQuery('#rowed3').jqGrid('editRow',id,true);
                     lastsel=id;
                 }
             }
...

其中lastsel是全局变量

因此,您可以使用jQuery('#rowed3').jqGrid('restoreRow',idOfLineToRestore); 在你的逃生事件中

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM