如何在jqGrid的內聯編輯中爲編輯/刪除指定不同的URL或參數？

Question

我們使用jqGrid在我們的網站上顯示交互式列表。我們有一個針對此列表的ajax數據調用的訪問層文件 - 它以特定格式接收參數並返回JSON結果。該訪問層需要url參數functionName和functionParams（json參數集合）。

我們在網格中提供內聯編輯和刪除功能，但問題是您只能爲兩者設置一個URL。

所以真的，我們需要編輯URL看起來是這樣的：

editurl: 'ListAjaxAccess.cfm?functionName=editMember&functionParams={"id":"341","firstName":"John","lastName":"Smith"}' 

和刪除URL看起來是這樣的：

editurl: 'ListAjaxAccess.cfm?functionName=deleteMember&functionParams={"id":"341"}' 

但是，你只能設置一個網址對於使用editurl進行內聯編輯和內聯刪除，editurl將表單發佈到頁面以及「操作員」參數進行區分。在定義editurl時，我似乎無法找到訪問操作參數或表單值的方法，以便我可以動態構建網址。

我可以看到的唯一方法是創建另一個文件inlineListProcessing.cfm，將editurl設置爲該文件，而該文件將構造適當的格式並調用ListAjaxAccess。我不想創建一個額外的中間文件 - 是否有其他選項？有沒有辦法調用不同的URL或基於操作動態構建url字符串？

Answer 1

有點奇怪，您需要使用HTTP POST，但將參數放在URL中。 URL中的參數通常只用於HTTP GET請求，但HTTP GET通常會被緩存（在HTTP頭中不會被禁止）。無論如何，一切皆有可能。

我將從刪除開始。瞭解formatter:'actions'在內部使用表格編輯delGridRow很重要，因爲哪些選項和回調描述爲here。選項url指定在Ajax請求中使用的URL，並且mtype選項可用於指定HTTP方法。默認是mtype: "POST"。要製作動態的URL，您可以使用例如onclickSubmit回調，其中第一個參數（options）是參考到內部選項delGridRow。您可以修改options的url屬性，然後jqGrid將在將發送到服務器的Ajax請求中使用修改後的URL。瞭解onclickSubmit的主要目標是通過附加信息擴展postdata，這一點很重要。如果不需要發送附加數據，應該返回空對象{}。 onclickSubmit的第二個參數是ID或逗號分隔的ID列表（如果您使用的是multiselect: true）。我想你不使用multiselect: true選項，只需要刪除一行。得到的onclickSubmit回調的代碼如下所示：

onclickSubmit: function (options, rowid) { 
    options.url = "ListAjaxAccess.cfm?functionName=deleteMember&functionParams=" + 
      JSON.stringify({id: rowid}); 
} 

，如果您使用免費的jqGrid比在這裏你可以設置回調很容易的地方。見the article。您可以包括與物業的jqGrid選項formDeleting：

formDeleting: { 
    onclickSubmit: function (options, rowid) { 
     options.url = "ListAjaxAccess.cfm?functionName=deleteMember&functionParams=" + 
       JSON.stringify({id: rowid}); 
    } 
} 

現在刪除行法delGridRow將使用回調（含formatter: "actions"）的任何電話。

如果您必須使用舊的jqGrid 4.6並且您使用的是formatter: "actions"，那麼您應該精確檢查formatter: "actions"here的選項。代碼中的相應更改將位於定義爲formatter: "actions"的列內。首先你應該永不使用name: ''。每列的name應該對應於HTML中的id的規則，並且這些值必須是唯一的。您可以使用類似

{ 
    formatter: "actions", 
    formatoptions: { 
     delOptions: { 
      onclickSubmit: function (options, rowid) { 
       options.url = "ListAjaxAccess.cfm?functionName=deleteMember&functionParams=" + 
         JSON.stringify({id: rowid}); 
      } 
     } 
    } 
} 

現在又回到了第二個問題：設置聯編輯的動態URL。這可能相對比較棘手，因爲我寫了在URL中放置參數對於HTTP POST來說絕對是不典型的。可以使用beforeSaveRow回調來動態修改URL，但回調的選項沒有修改結果。因此，您應該確認您確實需要將數據作爲URL的參數，並將相同的數據放在中，但HTTP POST的正文不適合您。

更新：如果您需要使用HTTP GET進行內聯編輯，那麼你應該先在你的代碼的開頭添加代碼

$.jgrid = $.jgrid || {}; 
$.jgrid.inlineEdit = $extend(true, $.jgrid.inlineEdit, {mtype: "GET"}); 

地方。它將用於內聯編輯的默認HTTP方法從「POST」更改爲「GET」。這是必需的，因爲舊版jqGrid 4.6版本的formatter: "actions"無法指定mtype內聯編輯選項。在免費的jqGrid中，可以使用mtype: "GET"內部的formatoptions屬性formatter: "actions"或者inlineEditing內部的jqGrid選項：inlineEditing: { mtype: "GET" }。

爲了使編輯可以使用serializeRowData回調的jqGrid內嵌的參數自定義格式（見here）：

editurl: "ListAjaxAccess.cfm", 
serializeRowData: function (postData) { 
    return { 
     functionName: "editMember", 
     functionParams: JSON.stringify(postData) 
    } 
} 

要使用HTTP GET進行刪除，你可以添加mtype: "GET"選擇上述delOptions。或者您可以使用另一種形式：

{ 
    formatter: "actions", 
    formatoptions: { 
     delOptions: { 
      mtype: "GET", 
      serializeDelData: function (postData) { 
       return { 
        functionName: "deleteMember", 
        functionParams: JSON.stringify({id: postData.id}); 
      } 
     } 
    } 
} 

兩個編輯和刪除將使用editurl: "ListAjaxAccess.cfm"，但將使用不同的URL參數。

我必須指出，默認情況下，HTTP GET將被緩存在Web瀏覽器中。爲確保不使用緩存，我建議您在URL上的服務器響應中設置Cache-Control: private, max-age=0 HTTP標頭。