MVC 3 - Ajax.BeginForm fait un post complet

Question

Dans le code suivant, j'utilise Ajax.BeginForm pour publier des données dans l'action de manière asynchrone. L'action est appelée mais les résultats sont affichés sur une nouvelle page Web. J'ai regardé une tonne d'exemples. Cela ne semble pas difficile. J'ai rendu l'exemple extrêmement simple pour une preuve de concept (poc), mais je vois toujours une nouvelle page affichée.

Manette

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

        return viewModel.UserName;
    }
 

Vue

 @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>
 

Answer 1

Pouvez-vous vérifier _Layout.cshtml et vous assurer que le script ajax est référencé? Je ne pense pas que ce soit par défaut:

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

Answer 2

Rappelez-vous également que vous en avez besoin dans la configuration Web.

   <appSettings>
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
  </appSettings>