1

タブに分割されたMVC3ページがあります。各タブには、異なるIDを持つAJAXフォームを含む部分的なビューがあります。 

@using (Ajax.BeginForm("Create1", "ControllerName", ajaxOptions, new { id = "frmCreate1" }))
...
@using (Ajax.BeginForm("Create2", "ControllerName", ajaxOptions, new { id = "frmCreate2" }))
...
@using (Ajax.BeginForm("Create3", "ControllerName", ajaxOptions, new { id = "frmCreate3" }))

各タブには、異なるIDの保存ボタンがあります。

<input type="submit" id="btnSave1" />
...
<input type="submit" id="btnSave2" />
...
<input type="submit" id="btnSave3" />
...

各タブには、ボタンのハンドラーを含むjavascriptファイルが含まれています。

// Submit Button
    $('#btnSave1').button({ label: "Save" });
    $('#btnSave1').click(function () {
        $.blockUI({ message: 'We are constructing your new Type 1, please wait just a moment...', theme: true, title: 'Saving' });
        $('frmCreate1').trigger('submit');
    });

...
// Submit Button
    $('#btnSave2').button({ label: "Save" });
    $('#btnSave2').click(function () {
        $.blockUI({ message: 'We are constructing your new Type 2, please wait just a moment...', theme: true, title: 'Saving' });
        $('frmCreate2').trigger('submit');
    });
...

// Submit Button
    $('#btnSave3').button({ label: "Save" });
    $('#btnSave3').click(function () {
        $.blockUI({ message: 'We are constructing your new Type 3, please wait just a moment...', theme: true, title: 'Saving' });
        $('frmCreate3').trigger('submit');
    });

すべてがバックエンドに適切に送信され、フォームから必要なデータを取得しています。ただし、メソッドのセレクターを次のように変更しました

$('#frmCreate1).trigger('submit');

そして今、それを実行すると、フォームが複数回送信され、デバッガーにジャンプして、その後同じデータを2回投稿します。

正しいセレクターを使用してAjax経由でフォームを送信し、その後、フォームの実際の送信を再度実行していると推測していますが、何が起こっているのかわかりません。

私が実際にやろうとしていることに関して、コードが正しいことを確認したいと思います。これらは、3つの単一の個別の送信である必要があります。[送信]ボタンを送信ではなくボタンタイプのみに変更しますか、それとも2回目の送信が発生しないようにJavaScriptにさらに追加する必要がありますか？PreventDefaultsか何か？

ありがとう！

編集：Ajaxオプションも含める必要があります。これらはそれぞれに発生し、タブに対応します。これらはすべて異なる名前が付けられていますが、「Post」メソッドがこれと関係がある場合に備えて。

@{
    AjaxOptions ajaxOptions = new AjaxOptions
    {
        HttpMethod = "Post",
        UpdateTargetId = "tabs-1",
    };
}
4

2 に答える 2

3

コメントから私の答えを再投稿する：

$('frmCreate1').trigger('submit');問題は、セレクターが要素を返さなかったために何もしていないときに、送信ボタンが実際にフォームを送信していたことでした。セレクターが「＃」を追加して有効になり、タグ名ではなくIDが検索されると、送信もトリガーされます。したがって、二重送信します。どちらかを選択した場合、二重送信を停止する必要があります。

于 2012-05-22T18:33:32.707 に答える
0

フォームが送信されていないようajaxilyです。

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

レイアウトで、セクションunobtrusiveJavascriptの下の構成ファイルで関連するフラグをtrueに設定する必要があることも可能にしますappSetting

  <appSettings>
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
  </appSettings>
于 2012-05-22T18:27:56.853 に答える