如何防止 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) {
                }

            });
        }