簡體   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