如何使jQuery行不可編輯，並使用ajax調用將同一行保存在數據庫中？

Question

我使用以下代碼對jqGrid進行了內聯編輯：

 if (rowid) {
      if (rowid !== lastsel) {
          $("#prjectForecastData").jqGrid('restoreRow', lastsel);
          $("#prjectForecastData").jqGrid('editRow', rowid, true);
          lastsel = rowid;
       } else {
              $("#prjectForecastData").jqGrid('restoreRow', lastsel);
              lastsel = "";
          }
    }

但是在下面的代碼中，在保存行的同時，我想進行ajax調用以將該行保存在數據庫中。 並且還希望使該行不可編輯。 現在， 'clientArray'用於臨時保存瀏覽器中的值，但是之后無法使其不可編輯。

$("#saveForecastEditData").click(function(){
     $("#prjectForecastData").jqGrid('saveRow',lastsel, false, 'clientArray');
       jQuery('#prjectForecastData').editRow(lastsel,false);
});

那么，如何在將行成功保存到DB中之后進行ajax調用並使該行不可編輯？

Answer 1

要使行不可編輯，應將not-editable-row類添加到相應的行。 確切的代碼可以取決於您使用的jqGrid配置。 例如，您可以添加行

$("#" + lastsel).addClass("not-editable-row");

在帶有saveRow的行saveRow ，但是對本地數據進行排序或分頁將重新創建網格主體，因此它將刪除任何先前設置的網格類或行。 為了使信息的持久，您可以在本地保存data連同主數據。 例如，您可以執行以下操作

$("#saveForecastEditData").click(function () {
    var $myGrid = $("#prjectForecastData"), rowData;
    $myGrid.jqGrid("saveRow", lastsel, { url: "clientArray"});
    rowData = $myGrid.jqGrid("getLocalRow", lastsel);
    // add new property to the data
    rowData.modified = true;
    // add the "not-editable-row" immediately
    $("#" + lastsel).addClass("not-editable-row");
});

"#prjectForecastData"網格的代碼可以使用rowattr ：

$("#prjectForecastData").jqGrid({
    // ... all your existing parameters here
    rowattr: function (rowData) {
        if (rowData.modified) {
            return {"class": "not-editable-row"};
        }
    }
});

它將在本地"not-editable-row"上還原類"not-editable-row" 。

要獲取所有已修改的行並將其發送到服務器，可以使用以下代碼

var data = $("#prjectForecastData").jqGrid("getGridParam", "data");
var modifiedData = $.grep(data, function (item) { return item.modified; } );
$.ajax({
    url: "someServerUtl",
    type: "POST",
    dataType: "json",
    data: {
        modifications: JSON.stringify(modifiedData)
    }
});

$.ajax請求的確切參數將取決於獲取數據的服務器代碼。

這樣，您將使用一個ajax調用保存所有修改的數據 。 另外，您可以在saveRow調用中使用另一個（基於服務器的） url 。 如果保存的一行數據將自動以文檔中所述的格式發送到服務器。