简体   繁体   English

如何防止 controller 改变视图

[英]How to prevent controller from changing the View

I'm new to MVC, and currently I'm trying to create a function for my form that exports it values to PDF.我是 MVC 的新手,目前我正在尝试为我的表单创建一个 function,将其值导出到 PDF。 I managed to do that using input with submit type that calls the controller.我设法使用带有调用 controller 的提交类型的输入来做到这一点。 My problem is when I want to keep the values in the form (because I want to create another button that will send the form as e-mail), but the form resets after clicking on the button.我的问题是当我想保留表单中的值时(因为我想创建另一个将表单作为电子邮件发送的按钮),但单击按钮后表单会重置。 I tried creating void function instead of action result, but after calling, the browser tries to redirect to another page with controller names as URL.我尝试创建 void function 而不是操作结果,但在调用后,浏览器尝试重定向到另一个页面 controller 名称为 URL。 I also tried to change the input type from submit to button, but after changing it, it won't call the controller on click.我也尝试将输入类型从提交更改为按钮,但更改后,它不会在单击时调用 controller。 So there is my question, how to call the controller without causing the form to reset its values.所以我的问题是,如何在不导致表单重置其值的情况下调用 controller。

Here is index.cshtml that calls the 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>

Here is the controller这是 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");
        }

You are doing Redirection in your server side code.您正在服务器端代码中进行重定向。

Do an AJAX call to your MVC controller (better if it is Web API controller) and from controller return HTTP OK / HTTP Accepted. Do an AJAX call to your MVC controller (better if it is Web API controller) and from controller return HTTP OK / HTTP Accepted. While doing AJAX call using JavaScript/jQuery on button click, prevent the default behaviour (submit the form) of the button like in this way:在单击按钮时使用 JavaScript/jQuery 进行 AJAX 调用时,请防止按钮的默认行为(提交表单),如下所示:

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

After receiving successful AJAX call response, proceed with whatever you want to do next.在收到成功的 AJAX 呼叫响应后,继续下一步您想做的事情。

You can try to return the model to Index action like this:您可以尝试将 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);
        }

Or you can use ajax to pass data when button click,so that the page will not be refreshed:或者您可以使用 ajax 在按钮单击时传递数据,这样页面就不会刷新:

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

js: js:

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

            });
        }

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM