jqGrid：如何删除行/从“navButtonAdd”和“delGridRow”？

Question

我遇到了jqGrid数据网格的问题。 我需要用“删除”按钮删除一行或多行。 这里我的代码：

$grid.navGrid('#pager', { edit: false, add: false, del: false, search: false }); 
$grid.navButtonAdd('#pager', { 
    caption: "Delete", 
    buttonicon: "ui-icon-del", 
    position: "last", 
    onClickButton: function() { 
     alert("Deleting Row"); 
     row_ids = $grid.getGridParam('selarrrow'); 
     $grid.delGridRow(row_ids, { 
      dataType: 'json', 
      mtype: 'GET', 
      url: '<?php echo $_SERVER['PHP_SELF'].'?app=my_app&action=record_delete'; ?>' 
     }); 
    } 
}); 

的这段代码发送到“URL”选项选中的行/秒的ID /秒（它的工作原理）。 该网址以json格式返回响应。此答案表示操作是否成功。 我需要显示该消息的提醒，我该怎么办？ 另一个问题是，当我点击“删除”按钮（在jqGrid的底部）时，它会显示一个带有“您想要删除选定项目？”的问题的ajax窗口，其中“是”输入和“没有“输入。当我点击“是”时，这个ajax窗口不会关闭！

谢谢！

但丁

EDIT [1] & & [2]

$(document).ready(function() 
{ 
    $grid = $("#list"); 
    fixPositionsOfFrozenDivs = function() { 
     if (typeof this.grid.fbDiv !== "undefined") { 
      $(this.grid.fbDiv).css($(this.grid.bDiv).position()); 
     } 
     if (typeof this.grid.fhDiv !== "undefined") { 
      $(this.grid.fhDiv).css($(this.grid.hDiv).position()); 
     } 
    }; 

    $grid.jqGrid({ 
     url: '<?php echo $_SERVER['PHP_SELF'].'?app=my_app&option=get_records'; ?>', 
     datatype: 'json', 
     mtype: 'GET', 
     height: 'auto', 
     width: window.innerWidth-35, //width: '1225', 
     colNames: ['ID', 'Column A', 'Column B', 'Column C', 'Column D'], 
     colModel: [ 
      { name: 'id', index: 'id', width: 130, align: 'center', search: true, 
       sortable: true, frozen: true, editable: true, edittype: 'text', formatter: 'showlink', 
       editoptions: { size: 130, maxlength: 50 }, stype: 'text' }, 
      { name: 'col_a', index: 'col_a', width: 250, align: 'left', search: true, 
       sortable: true, frozen: false, editable: true, edittype: 'text', 
       editoptions: { size: 250, maxlength: 40 }, stype: 'text' }, 
      { name: 'col_b', index: 'col_b', width: 120, align: 'left', search: true, 
       sortable: true, frozen: false, editable: true, edittype: 'text', 
       editoptions: { size: 120, maxlength: 40 }, stype: 'text' }, 
      { name: 'col_c', index: 'col_c', width: 100, align: 'right', search: true, 
       sortable: true, frozen: false, editable: true, edittype: 'text', 
       editoptions: { size: 100, maxlength: 40 }, stype: 'text' }, 
      { name: 'col_d', index: 'col_d', width: 100, align: 'right', search: true, 
       sortable: true, frozen: false, editable: true, edittype: 'text', 
       editoptions: { size: 100, maxlength: 6 }, stype: 'text' } 
     ], 
     caption: 'Objects', 
     pager: '#pager', 
     sortname: 'id', 
     sortorder: 'ASC', 
     rowNum: 25, 
     rowList: [25, 50, 100, 200, <?php echo $totrecords; ?>], 
     loadonce: true, 
     gridview: true, 
     viewrecords: true, 
     rownumbers: true, 
     rownumWidth: 40, 
     toppager: true, 
     multiselect: true, 
     autoencode: true, 
     ignoreCase: true, 
     shrinkToFit: false, 
     loadComplete: function() { 
      $("option[value=<?php echo $totrecords; ?>]").text('All'); 
     }, 
     editurl: '<?php echo $_SERVER['PHP_SELF'].'?app=my_app&option=delete_records'; ?>' 
    }); 

    $grid.jqGrid('filterToolbar', {multipleSearch: false, stringResult: false, searchOnEnter: false, defaultSearch: 'cn'}); 
    $grid.navGrid('#pager', { edit: false, add: false, del: false, search: false }); 
    $grid.navButtonAdd('#pager', { 
     caption: "Delete", 
     buttonicon: "ui-icon-del", 
     position: "last", 
     onClickButton: function() { 
      row_ids = $grid.getGridParam('selarrrow'); 
      $grid.delGridRow(row_ids, { 
       closeOnEscape: true, 
       mtype: 'POST', 
       afterSubmit: function(data_from_server, array_data) { 
        var result = data_from_server.responseText; 
        var message = eval('(' + result + ')'); 
        alert(message.query); 
       } 
      }); 
     } 
    }); 

    $grid.jqGrid('setFrozenColumns'); 
    $grid[0].p._complete.call($grid[0]); 
    fixPositionsOfFrozenDivs.call($grid[0]); 

}); 

Answer 1

您应该能够使用afterSubmit事件来显示您的消息。从jqGrid documentation：

afterSubmit响应后

大火已经从服务器接收。通常用于显示来自服务器的状态（例如，由于服务器端原因，数据被成功删除或删除被取消）。接收从请求返回的数据以及类型为id = value1，value2的发布值的数组作为参数。 使用此事件时，应返回包含以下项目的数组[success, message] 其中success是布尔值，如果为true，则该过程继续，如果为false，则会显示错误消息并停止所有其他处理。

afterSubmit : function(response, postdata) 
{ 
    … 
    return [succes,message] 
} 

关于你的第二个问题，我不知道为什么Ajax的窗口不会关闭。您是否调试过代码，以确定当时是否收到JavaScript错误？如果没有，您可能需要发布一个小例子来说明问题。

Answer 2

使用HTTP GET进行删除操作并不好。你是否希望在同一个URL上的以前的服务器响应将被缓存，而不是发送到服务器？默认值mtype是'POST'。如果在服务器端有RESTfull服务，则需要使用mtype: 'DELETE'，但'GET'的使用只对某些不会删除服务器上任何内容的虚拟代码有意义。

此外，您使用的参数dataType: 'json'不存在delGridRow（请参阅the documentation）。即使您使用ajaxDelOptions: { datyType: "json" }，您也会得到服务器响应（请参阅Justin的答案），不会自动从JSON转换为对象。原因是delGridRow的当前代码使用complete回调代替success回调（请参阅here）。所以如果你从服务器得到JSON响应，你必须在afterSubmit回调中明确地调用$.parseJSON（参见Justin的回答）。