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');

现在，当运行它时，表单被多次提交，导致我跳入调试器并随后两次发布相同的数据。

我猜它是通过 Ajax 使用正确的选择器提交表单，然后再次触发表单的实际提交，但我不确定发生了什么。

我想确保代码就我真正想做的事情而言是正确的。这些应该是 3 个单独的单独提交。我是否将“提交”按钮更改为仅按钮类型而不是提交，还是应该在 javascript 中有更多内容以防止发生第二次提交？preventDefaults 什么的？

谢谢！

编辑：还应该包括 Ajax 选项，它们出现在每个选项卡上并对应于选项卡，它们的名称都不同，但以防万一“发布”方法与此有关。

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

2 回答 2

3

从评论中重新发布我的答案：

问题是提交按钮实际上是在提交表单，而选择器$('frmCreate1').trigger('submit');什么也没做，因为它没有返回任何元素。When the selector was made valid by adding the '#' so that it looked for an id rather than a tag name, then that triggered the submit as well. 因此双重提交。如果您选择应该停止双重提交的一个或另一个。

于 2012-05-22T18:33:32.707 回答
0

好像表单没有提交ajaxily确保您已包含

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

在您的布局中，还使unobtrusiveJavascript您必须在配置文件中的appSetting部分下将相关标志设置为 true

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