asp.net-mvc-4 - 部分ビュー用の目立たない Ajax フォーム

Question

邪魔にならない ajax を使用して、お問い合わせフォームからデータを投稿するのに問題があります。

私の部分的なビューは次のようなものです:

@model site.ViewModel.Home.ContactUsViewModel 

@using (Ajax.BeginForm("_ContactUsPartial", "Home", 
                       new AjaxOptions { UpdateTargetId = "result" }))
        {
            <fieldset>
                <legend>Contact Us</legend>
                @Html.ValidationSummary(true)
                <div id="result"></div>
                <div class="editor-label">
                 @Html.LabelFor(m => m.FullName)
                 @Html.ValidationMessageFor(m => m.FullName)</div>
                <div class="editor-field">@Html.TextBoxFor(m => m.FullName)</div>
                <!-- other fields from model -->
                <input type="submit" value="Submit"/>
            </fieldset>
        }

私の部分的なビューは、次のように別のページに配置されます。

@Html.Partial("_ContactUsPartial", new ContactUsViewModel());

私のホームコントローラーは次のようになります：

[HttpPost]
public ActionResult _ContactUsPartial(ContactUsViewModel viewModel)
{
    if (ModelState.IsValid)
    {
       try
       {
           //send email
           return Content("Thanks for your message!");
       }
       catch (Exception ex)
       {
          return Content("Problem sending the email.");
       }
    }

            return Content("oops. invalid model");
}

私が期待しているのは、送信を押すと、コントローラーが「結果」のIDを持つdivに配置されるテキストコンテンツを返すことです。

実際に何が起こっているかというと、送信を押すと、/Home/_ContactUsPartial にリダイレクトされ、テキスト コンテンツだけが表示されます。

ここで何が起こっているのか理解できません...そして、オンラインで例を見回そうとしましたが、この穴を深く掘り下げていることに気づきました。

Web.config で目立たない JavaScript を有効にしており、jquery.unobtrusive-ajax.min.js への参照も持っています。

私の Scripts フォルダーには、関連する可能性のある次のものがあります。

• jquery.unobtrusive-ajax.min.js
• jquery.validate.unobtrusive.min.js
• MicrosoftMvcAjax.js

私の _Layout.cshtml タグでは、次のように宣言しています。

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

私の Global.asax.cs Application_Start には、次の行があります。

BundleConfig.RegisterBundles(BundleTable.Bundles);

RegisterBundles は次のようになります。

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
                        "~/Scripts/jquery-ui-{version}.js"));

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.unobtrusive*",
                        "~/Scripts/jquery.validate*"));

この ScriptBundle を介してそれらを取り込むように構成されているように見えるため、バンドルがどのように機能し、どのように機能するかはわかりません...しかし、_Layout.cshtml のヘッドで手動で構成することもできます....

私が間違っていることは何か分かりますか？これについて何か助けていただければ幸いです。