MVC 3 - Ajax.BeginForm做一个完整的回发 [英] MVC 3 - Ajax.BeginForm does a full post back

问题描述

在以下code，我使用Ajax.BeginForm到数据不同步后的行动。该行动被调用，但结果都显示为一个新的网页。我心中已经看了一吨的例子。这似乎并不难。我做了榜样概念（POC）的证明非常简单，但我仍然看到显示了新的一页。

控制器

  [HttpPost]
    [的OutputCache（位置= OutputCacheLocation.None，NoStore = TRUE）]
    公共字符串TestAjax（UserViewModel视图模型）
    {        返回viewModel.UserName;
    }
 

查看

  @model BasicMvc3Example2.Models.UserViewModel@ {
    ViewBag.Title =索引2;
    布局= NULL; //〜/查看/共享/ _Layout.cshtml
}      ＆LT;脚本的src =/ BasicMvc3Example2 /脚本/ jQuery的-1.4.4.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
    ＆LT;脚本的src =/ BasicMvc3Example2 /脚本/ jQuery的-ui.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
    ＆LT;脚本的src =/ BasicMvc3Example2 /脚本/ jquery.validate.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
    ＆LT;脚本的src =/ BasicMvc3Example2 /脚本/ jquery.validate.unobtrusive.js类型=文/ JavaScript的＆GT;＆LT; / SCRIPT＆GT;
    ＆LT; H2＆GT;索引2＆LT; / H＆GT;    ＆LT;脚本类型=文/ JavaScript的＆GT;
        功能PostFailure（）{
            警报（失败）;
        }        功能PostSuccess（）{
            警报（成功）;
        }        功能PostOnComplete（）{
            警报（完整）;
        }
    ＆LT; / SCRIPT＆GT;    页面渲染：@ DateTime.Now.ToLongTimeString（）
    @using（Ajax.BeginForm（TestAjax，新AjaxOptions {列举HTTPMethod =邮报，UpdateTargetId =textEntered，onFailure处=PostFailure的onSuccess =PostSuccess的onComplete =PostOnComplete}））
    {
        ＆LT; D​​IV＆GT;
           @ Html.LabelFor（M = GT; m.UserName）
           @ Html.TextBoxFor（M = GT; m.UserName）
        ＆LT; / DIV＆GT;        ＆LT; D​​IV＆GT;
           @ Html.LabelFor（M = GT; m.Password）
           @ Html.TextBoxFor（M = GT; m.Password）
        ＆LT; / DIV＆GT;        ＆LT; D​​IV＆GT;
           @ Html.LabelFor（M = GT; m.EmailAddress）
           @ Html.TextBoxFor（M = GT; m.EmailAddress）
        ＆LT; / DIV＆GT;        ＆LT;输入类型=提交ID =submitFormVALUE =提交表单/＆GT;
    }    ＆LT; D​​IV ID =textEntered＆GT; D＆LT; / DIV＆GT;
 

解决方案

您可以检查 _Layout.cshtml ，并确保AJAX脚本引用？我不认为这是默认为：

 ＆LT;脚本的src =@ Url.Content（〜/脚本/ jquery.unobtrusive-ajax.min.js）TYPE =文/ JavaScript的＆GT;＆LT ; / SCRIPT＆GT;
 

In the following code, I'm using Ajax.BeginForm to post data to the action asynchronously. The action gets called but the results are displayed to a new web page. I'v looked at a ton of example. This doesn't seem difficult. I've made the example extremely simple for a proof of concept (poc), but I'm still seeing a new page displayed.

Controller

  [HttpPost]
    [OutputCache(Location = OutputCacheLocation.None, NoStore = true)]
    public string TestAjax(UserViewModel viewModel)
    {

        return viewModel.UserName;
    }

View

@model BasicMvc3Example2.Models.UserViewModel

@{
    ViewBag.Title = "Index2";
    Layout = null;//"~/Views/Shared/_Layout.cshtml";
}

      <script src="/BasicMvc3Example2/Scripts/jquery-1.4.4.js" type="text/javascript"></script>
    <script src="/BasicMvc3Example2/Scripts/jquery-ui.js" type="text/javascript"></script>
    <script src="/BasicMvc3Example2/Scripts/jquery.validate.js" type="text/javascript"></script>
    <script src="/BasicMvc3Example2/Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script>
    <h2>Index2</h2>

    <script type="text/javascript">
        function PostFailure(){
            alert("Failure");
        }

        function PostSuccess(){
            alert("Success");
        }

        function PostOnComplete() {
            alert("Complete");
        }
    </script>

    Page Rendered: @DateTime.Now.ToLongTimeString()
    @using (Ajax.BeginForm("TestAjax", new AjaxOptions { HttpMethod = "Post", UpdateTargetId = "textEntered", OnFailure = "PostFailure", OnSuccess = "PostSuccess", OnComplete = "PostOnComplete" }))
    {
        <div>
           @Html.LabelFor(m => m.UserName)
           @Html.TextBoxFor(m => m.UserName)
        </div>

        <div>
           @Html.LabelFor(m => m.Password)
           @Html.TextBoxFor(m => m.Password)
        </div>

        <div>
           @Html.LabelFor(m => m.EmailAddress)
           @Html.TextBoxFor(m => m.EmailAddress)
        </div>

        <input type="submit" id="submitForm" value="Submit Form" />
    }

    <div id="textEntered">d</div>

解决方案

Can you check _Layout.cshtml and make sure the ajax script is referenced? I don't think it is by default:

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>

这篇关于MVC 3 - Ajax.BeginForm做一个完整的回发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！