如何防止 controller 改變視圖

Question

我是 MVC 的新手，目前我正在嘗試為我的表單創建一個 function，將其值導出到 PDF。 我設法使用帶有調用 controller 的提交類型的輸入來做到這一點。 我的問題是當我想保留表單中的值時（因為我想創建另一個將表單作為電子郵件發送的按鈕），但單擊按鈕后表單會重置。 我嘗試創建 void function 而不是操作結果，但在調用后，瀏覽器嘗試重定向到另一個頁面 controller 名稱為 URL。 我也嘗試將輸入類型從提交更改為按鈕，但更改后，它不會在單擊時調用 controller。 所以我的問題是，如何在不導致表單重置其值的情況下調用 controller。

這是調用 controller 的 index.cshtml

  <div class="row clearfix">
        <div class="input-group">
            <input id="pdfBtn" value="Export to pdf" type="submit" formaction="@Url.Action("pdfExport")" />
        </div>
    </div>

這是 controller

        [HttpPost]
        public ActionResult pdfExport([Bind(Include = "formId,formType,additionalTypeInfo,nameSurname,description,Attachment")] FormModel model)
        {
            if (ModelState.IsValid)
            {
                var pdf = new FormToPdf(model);
            }
            return RedirectToAction("Index");
        }

Answer 1

您正在服務器端代碼中進行重定向。

Do an AJAX call to your MVC controller (better if it is Web API controller) and from controller return HTTP OK / HTTP Accepted. 在單擊按鈕時使用 JavaScript/jQuery 進行 AJAX 調用時，請防止按鈕的默認行為（提交表單），如下所示：

function onButtonClickPdfExportToServerUsingAjax(e){ 
   e.PreventDefault(); 
   // AJAX call
}

在收到成功的 AJAX 呼叫響應后，繼續下一步您想做的事情。

Answer 2

您可以嘗試將 model 返回到 Index 操作，如下所示：

[HttpPost]
        public ActionResult pdfExport([Bind(Include = "formId,formType,additionalTypeInfo,nameSurname,description,Attachment")] FormModel [HttpPost]
        public ActionResult pdfExport([Bind(Include = "formId,formType,additionalTypeInfo,nameSurname,description,Attachment")] FormModel model)
        {
            if (ModelState.IsValid)
            {
                var pdf = new FormToPdf(model);
            }
            return RedirectToAction("Index");
        })
        {
            if (ModelState.IsValid)
            {
                var pdf = new FormToPdf(model);
            }
            return RedirectToAction("Index",model);
        }

或者您可以使用 ajax 在按鈕單擊時傳遞數據，這樣頁面就不會刷新：

<input id="pdfBtn" value="Export to pdf" type="button" onclick="pdfExport()"/>

js：

function pdfExport() {
            $.ajax({
                type: "POST",
                url: "pdfExport",
                data: Data,
                success: function (data) {
                }

            });
        }