0

以下のようなエリアがあります。

ここに画像の説明を入力してください

コントローラクラス

public class AdminController : Controller
{
    //
    // GET: /Admin/Admin/
    [HttpPost]
    public ActionResult Index_partialPost(AdminModule model)
    {
        return PartialView("_PartialPage1", model);
    }

    [HttpGet]
    public ActionResult Index_partial()
    {
        return PartialView("_PartialPage1");
    }

    [HttpGet]
    public ActionResult Index()
    {
        AdminModule model = new AdminModule();
        model.MyName = "My Name";
        return View("Index", model);
    }
}

意見

@model _1.Areas.Admin.Models.AdminModule
@{
    ViewBag.Title = "Index";
    Layout = "~/Areas/Admin/Views/Shared/_LayoutPage1.cshtml";
}
<h2>
    Index</h2>
<div id="myForm">
    <p id="pid">
    </p>
</div>
<input id="BTN" type="submit" value="Button" />
<script language="javascript" type="text/javascript">
    $('#BTN').click(function(){
        $('#pid').load("@Url.Action("Index_partial", "Admin")");
    });
</script>

意見

@model _1.Areas.Admin.Models.AdminModule
@{
    ViewBag.Title = "Index";
    Layout = "~/Areas/Admin/Views/Shared/_LayoutPage1.cshtml";
}
<h2>
    Index</h2>
<script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript">
</script>
<div id="myForm">
    <p id="pid">
    </p>
</div>
<input id="BTN" type="submit" value="Button" />
<script language="javascript" type="text/javascript">
    $('#BTN').click(function(){
        $('#pid').load("@Url.Action("Index_partial", "Admin")");
    });
</script>

部分図

@model _1.Areas.Admin.Models.AdminModule
@using (Html.BeginForm())
{
    @Html.LabelFor(i => i.MyName)
    @Html.TextBoxFor(i => i.MyName)
    @Html.ValidationMessageFor(i => i.MyName)
    <p id="getDateTimeString">
    </p>
    <input type="submit" value="Click here" id="btn" />
}

<script language="javascript" type="text/javascript">
    $('#btn').click(function () {
        var url = '@Url.Action("Index_partialPost", "Admin")';
        $.post(url, null, function (data) {
        });
    });
</script>

問題は-jQueryを使用して部分ビューを投稿しようとすると-投稿が機能せず、404が表示されます。以下の部分ビューのコードを使用してAjaxで機能しています

@model _1.Areas.Admin.Models.AdminModule
@using (Ajax.BeginForm("Index", "Admin", 
        new AjaxOptions { UpdateTargetId = "myForm", HttpMethod = "Post" }))
{
    @Html.LabelFor(i => i.MyName)
    @Html.TextBoxFor(i => i.MyName)
    @Html.ValidationMessageFor(i => i.MyName)
    <p id="getDateTimeString">
    </p>
    <input type="submit" value="Click here" id="btn" />
}
4

2 に答える 2

1

クリックハンドラからfalseを返すことにより、フォームのデフォルトのアクションをキャンセルする必要があります。

<script type="text/javascript">
    $('#btn').click(function () {
        var url = '@Url.Action("Index_partialPost", "Admin")';
        $.post(url, null, function (data) {
        });
        return false;
    });
</script>

そうしないと、フォームがサーバーに送信され、ブラウザーがターゲットURLにリダイレクトされるため、AJAXリクエストを実行する時間がまったくなくなります。

送信ボタンの.clickイベントの代わりに、AJAXリクエストを実行するには、フォームの.submitイベントをサブスクライブする方がはるかに優れていることに注意してください。この理由は明らかです。送信ボタンをクリックする以外に、フォームを送信する方法があります。たとえばEnter、入力フィールド内でキーを押します。これが発生した場合、AJAXは実行されません。

だからここに正しい方法があります。フォームに一意のIDを指定することから始めます。

@using (Html.BeginForm(null, null, FormMethod.Post, new { id = "myForm" }))
{
    @Html.LabelFor(i => i.MyName)
    @Html.TextBoxFor(i => i.MyName)
    @Html.ValidationMessageFor(i => i.MyName)
    <p id="getDateTimeString">
    </p>
    <input type="submit" value="Click here" id="btn" />
}

次に、このフォームを目立たないようにAJAX化できます。

<script type="text/javascript">
    $('#myForm').submit(function () {
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function(result) {

            }
        });
        return false;
    });
</script>
于 2013-02-06T14:54:27.767 に答える
0

部分ビューで@Url.Actionを実行するrouteparameterでAreaを定義する必要があると思います。

$('#btn').click(function () {
        var url = '@Url.Action("Index_partialPost", "Admin", new { area = "Admin"})';
        $.post(url, null, function (data) {
        });
});

それ以外の場合は、AdminControllerがない可能性のあるメイン（ルート）エリアに投稿されます...

フォームがレンダリングされるときに、HTMLソースのJSのURLを再確認できます。フォームは、「/ Admin/Index_partialPost」ではなく「/Admin/ Admin/Index_partialPost」と表示されます。

于 2013-02-06T14:58:17.570 に答える