0

新しいユーザーを作成するための編集フォームがあるとします。これで、保存ボタンが別のセクションであるフッターに配置されました。

私の問題は、ボタンが別のセクションにあるため、編集フィールドと保存ボタンを 1 つのフォームで取得できないことです。

そのため、フォームを送信できません。

この問題への最善のアプローチは何ですか?

_Layout.cshtml

<div class="content">
    @RenderBody()
</div>
<div class="footer">
    @RenderSection("Footer")
</div>

インデックス.cshtml

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@section Footer
{
    <input type="submit" value="Save" />
}

@using(Html.BeginForm())
{
    <h2>New User</h2>
    @Html.EditorForModel()
}
4

3 に答える 3

2

次のステートメントform.Dispose()の代わりに、明示的に呼び出すことができます。using

@{ var form = Html.BeginForm() }

<h2>New User</h2>
@Html.EditorForModel()

@section Footer
{
    <input type="submit" value="Save" />
    @{ form.Dispose(); }
}

編集

ただし、少なくとも Body セクションと Footer セクションが同じコンテナー内にあることを確認する必要があります。次に例を示します。

<div class="content">
    @RenderBody()
    <div class="footer">
        @RenderSection("Footer")
    </div>
</div>

質問に書かれているレイアウトでは、ボタンが表示される前にcontentdiv (したがってformタグ) を閉じる必要がありsubmitます。これが論理的に機能する方法はありません。

<div class="content">
    @RenderBody()               @@ form opens, and therefore must close here
</div>
<div class="footer">
    @RenderSection("Footer")    @@ submit button is here -- can never be inside the form
</div>

編集上の余談: フォームを複数の部分ビューに分割するのは非常に悪い考えのようです。あなたはそれをコードのにおいと呼ぶかもしれません-私は可能であればそれを避けたいと思います.

于 2012-12-14T08:57:13.683 に答える
1

あなたはかなり厄介な回避策を見つけました。私はそれをこのようにすることを提案します：

  • クリックされたさまざまなボタンのアクションを区別するために、モデルに新しいプロパティを作成します。public string Action { get; set; }
  • IDを作成し、新しいモデルプロパティの非表示の入力を含めます。
<form id="my-form">
    @Html.HiddenFor(x => x.Action)
    ...
</form>
  • 同じクラスで値が異なるフッターにボタンを作成します。
<button class="btn-submit" value="action1">Submit</button>
<button class="btn-submit" value="action2">Submit</button>
  • 次のJavaScriptを使用します。
$('.btn-submit').live('click', function() {
    // update value of hidden input inside the form
    $('#Action').val($(this.val()));
    // submit the form
    $('#my-form').submit();
});
  • ActionResultで、Actionプロパティの値に基づいてさまざまなアクションを実行します。
public ActionResult WahteverAction(WhateverModel model)
{
    if(ModelState.IsValid)
    {
        if(model.Action == "action1")
        {
            // do whatever needs to be done for action1
        }
        if(model.Action == "action2")
        {
            // do whatever needs to be done for action2
        }
    }
    return View();
}
于 2012-12-18T17:19:28.773 に答える
0

問題の回避策を見つけました。それは良くありませんが、うまくいきます。

送信ボタンをアンカーに置き換えました。アンカーをクリックすると、JavaScript 関数が呼び出されます。

<a name="save" onclick="submitAction(this)"></a>

JavaScript 関数はフォームに非表示の送信ボタンを作成し、それをクリックします。

function submitAction(sender) {
    var action = $(sender).attr('name');
    $('form').append('<input type="submit" style="display:none" id="tmpSubmit" />');
    $('#tmpSubmit').attr('name', action);
    $('#tmpSubmit').click();
}
于 2012-12-18T16:50:44.253 に答える