更新和刪除在jqGrid中不起作用

Question

我正在開發web api項目，我想用CRUD操作實現網格。 這些都是我的Web API方法：

[HttpGet] 
public HttpResponseMessage GetAllPosting() {} 

[HttpGet] 
public HttpResponseMessage GetPostingById(int Id) {} 

[HttpPost] 
public HttpResponseMessage Post([FromBody] vGeneralLedger item) {} 

[HttpPut] 
public HttpResponseMessage Put(int id, vGeneralLedger item) {} 

[HttpDelete] 
public void Delete(int id) {} 

在我看來頁面，我定義的jqGrid：

jQuery("#generalLedgerGrid").jqGrid({ 
... 
... 
}); 

function updateDialog(action) { 
    return { 
     url: API_URL, // 'http://localhost:xxxxx/api/GeneralLedgerDetails/' 
     closeAfterAdd: true, 
     closeAfterEdit: true, 
     afterShowForm: function (formId) { }, 
     jqmodal: true, 
     afterSubmit: function (params) { 
      var list = $("#generalLedgerGrid"); 
      var selectedRow = list.getGridParam("selrow"); 
      rowData = list.getRowData(selectedRow); 
      params.url += rowData.Id; 
      params.mtype = action; 
     }, 
     bSubmit: "Submit", 
     bCancel: "Cancel", 
     width: "400", 
     reloadAfterSubmit: true 
    }; 
} 

jQuery("#generalLedgerGrid").jqGrid('navGrid', '#generalLedgersPager', 
    { edit: true, add: true, del: true }, 
    updateDialog('PUT'), 
    updateDialog('POST'), 
    updateDialog('DELETE') 
); 

當我運行應用程序時，網格顯示在頁面（視圖）的所有數據。但是，如果我想編輯排柵，或刪除，然後總是被重定向（當我把斷點到我的API方法）來

[HttpPost] 
public HttpResponseMessage Post([FromBody] vGeneralLedger item) 

，並編輯和刪除功能不能正常工作。還有一個問題：當我想在網格中添加新記錄（在打開的對話框中）並按下保存按鈕時，我的對話框仍處於打開狀態，當我關閉對話框時，我必須重新加載頁面以顯示最新記錄。

而且，我已經使用這個教程： http://techbrij.com/add-edit-delete-jqgrid-asp-net-web-api

UPDATE： 這是網格我目前的數據行（我只是張貼圖片）： enter image description here

UPDATE： 這是GetAllPosting方法

[HttpGet] 
    public HttpResponseMessage GetAllPosting() 
    { 
     try 
     { 
      var generalLedgers = _db.genLedgers.Where(x => x.Status == true).Select(a => new 
      { 
       Id = a.Id, 
       finNaturalBusinessYearId = a.finNaturalBusinessYearId, 
       finDocumentTypeId = a.finDocumentTypeId, 
       AccountNo = a.AccountNo, 
       PostingDate = a.PostingDate, 
       MaturityDate = a.MaturityDate, 
       AmountDebit = a.AmountDebit, 
       AmountCredit = a.AmountCredit, 
       Balance = a.Balance, 
       Description = a.Description, 
       DateCreated = DateTime.Now, 
       UserId = 1 
      }); 

      var formatter = new JsonMediaTypeFormatter(); 
      var json = formatter.SerializerSettings; 
      json.NullValueHandling = Newtonsoft.Json.NullValueHandling.Ignore; 
      json.Formatting = Newtonsoft.Json.Formatting.Indented; 

      return Request.CreateResponse(HttpStatusCode.OK, generalLedgers, formatter); 
     } 
     catch (Exception ex) 
     { 

      throw; 
     } 
    } 

選擇正文中的Linq語句與我的實體模型類屬性相對應。

而且這是我網格的定義：

UPDATE：

jQuery("#generalLedgerGrid").jqGrid({ 
     height: 290, 
     width: 1200, 
     url: API_URL, 
     mtype: "GET", 
     contentType: "application/json; charset=utf-8", 
     datatype: "json", 
     serializeGridData: function (postData) { 
      return JSON.stringify(postData); 
     }, 
     jsonReader: { 
      root: function (obj) { return obj; }, 
      page: function (obj) { return 1; }, 
      total: function (obj) { return 1; }, 
      records: function (obj) { return obj.length; }, 
      Id: "0", 
      cell: "", 
      repeatitems: false, 
      celledit: false 
     }, 
     colNames: ['Id', 'NB Year Id', 'Document Type Id', 'Account No', 'Posting Date', 'Maturity Date', 'Description', 'Total Debit', 'Total Credit', 'Balance'], 
     colModel: [ 
      { name: 'Id', align: "center", editable: false, width: "45px" }, 
     { name: 'finNaturalBusinessYearId', align: "center", editable: true, width: "75px" }, 
     { name: 'finDocumentTypeId', align: "center", editable: true }, 
     { name: 'AccountNo', align: "center", editable: true }, 
     { 
      name: 'PostingDate', align: "center", editable: true 
     }, 
     { name: 'MaturityDate', align: "center", editable: true }, 
     { name: 'Description', align: "center", editable: true }, 
     { name: 'AmountDebit', align: "center", editable: true }, 
     { name: 'AmountCredit', align: "center", editable: true }, 
     { name: 'Balance', align: "center", editable: true } 
     ], 
     gridview: true, 
     autoencode: true, 
     ignorecase: true, 
     reloadGridOptions: {fromServer: true}, 
     sortname: "InstallmentDate", 
     sortorder: "asc", 
     viewrecords: true, 
     rowNum: 10, 
     rowList: [10, 15, 20], 
     pager: '#generalLedgersPager', 
     caption: "General Ledger Posting List" 
    }); 

UPDATE： 這是我從網上API控制器刪除方法：

[HttpDelete] 
    public void Delete(int id) 
    { 
     finGeneralLedger item = _db.genLedgers.Find(id); 
     if (item == null) 
     { 
      throw new HttpResponseException(HttpStatusCode.NotFound); 
     } 
     item.Status = false; 
     item.DateUpdated = DateTime.Now; 
     item.UserId = 1; 

     _db.SaveChanges(); 
    } 

Answer 1

的代碼中的主要錯誤來自使用afterSubmit。該回調將使用後的響應將從服務器獲得。我想你只是想用另一個回調onclickSubmit，但你用錯了。

正確onclickSubmit回調添加/編輯可以刪除對話框的下面

onclickSubmit: function (options, postdata, formOper) { 
    options.url = API_URL + "/" + encodeURIComponent(postdata[this.id + "_id"]); 
    options.mtype = formOper === "add" ? "POST" : "PUT"; 
} 

選項：

{ 
    mtype: "DELETE", 
    serializeDelData: function() { 
     return ""; // the body MUST be empty in DELETE HTTP requests 
    }, 
    onclickSubmit: function (options, postdata) { 
     options.url = API_URL + "/" + encodeURIComponent(postdata); 
    } 
} 

如果API_URL價值已經包含/在字符串的結尾，那麼您應該在上面的代碼片段中替換API_URL + "/"to API_URL。