防止其他 asp 按钮执行提交操作答案

【问题标题】：Prevent other asp buttons from performing submit action防止其他 asp 按钮执行提交操作
【发布时间】：2014-12-22 20:44:41
【问题描述】：

我正在构建一个上传表单。随着上传，用户需要输入一些数据，并且可能会或可能不会使用购物车。购物车按钮从购物车中删除列表或完全清空购物车。但是，当我尝试使用这些按钮时，页面会执行我指示的提交操作，返回 validateForm()....

<form enctype="multipart/form-data" runat="server" method="post" action="gpsFieldPics.py" name="uploadForm" id="uploadForm" onSubmit="return validateForm()">

<asp:Button ID="btnRemove" runat="server" Text="Remove Track"  OnClick="btnRemove_Click" /><br />
<asp:Button ID="btnEmpty" runat="server" Text="Empty Cart" OnClick="btnEmpty_Click"  />
<asp:ListBox ID="trkCart" runat="server" SelectionMode="Multiple"></asp:ListBox>

<input id="btnProcess" type="submit" value="Upload and Process" onclick="selectAllTracks()" /></form>

顺便说一句，这不是完整的形式。我尝试使用它... UseSubmitBehavior="false" ，但它并没有像我想象的那样工作。这是我正在尝试使用的函数背后的代码......

protected void btnRemove_Click(object sender, EventArgs e) 
{
    if (trks.Count &gt; 0)
    {
        if (trkCart.SelectedIndex &gt; -1)
        {
            trks.RemoveAt(trkCart.SelectedIndex);
            this.DisplayTrackCart();
        }
        else
        {
            lblMessage.Text = "Please select the item you want to remove.";
        }
    }
}

protected void btnEmpty_Click(object sender, EventArgs e)
{
    if (trks.Count &gt; 0)
    {
        trks.Clear();
        trkCart.Items.Clear();
    }
}

我显然不能使用 PageFunctions 或 Ajax 来调用代码隐藏函数，因为它们不是静态的并且不返回任何内容。

我也不能将表单分成两个表单，因为一个 asp 页面不能有两个带有 runat=server 的表单，而且因为我使用的 python cgi 脚本似乎只能恢复一个表单的元素而不是两个。

关于我能做什么的任何想法？我唯一能想到的是，我必须有两种形式，一种是基本的 html 形式，另一种是 asp.net 形式。对于 asp.net 表单中的购物车，我需要在 html 表单中添加一个隐藏的列表框以及在购物车更新时更新它的功能。

【问题讨论】：

标签： javascript asp.net forms

【解决方案1】：

看起来您正在为表单手动创建 HTML 标记（这很好）。代替用

装饰表单

onSubmitEvent="return validateForm()",

改为将其设置为

onSubmit="return false"

这将导致表单无法提交任何内容，除非以编程方式告知这样做。接下来，您将一些 JS 添加到您想要实际处理验证和提交的按钮，像这样

<script>
   function ValidateAndSubmit() {
       selectAllTracks();
       if (ValidateForm()) { 
         document.getElementById('uploadForm').submit(); 
       }
   }
</script>

...

<input id="btnProcess" type="submit" value="Upload and Process" onclick="ValidateAndSubmit()" />

【讨论】：

如果我设置这个... onSubmit="return false" 我不能使用
嘿@razor_nate，如果您依赖服务器端事件处理程序来处理这些按钮，那么您是正确的。您无法阻止表单以这种方式提交。您只需删除 onSubmit="return false" 这将允许其他按钮仍然导致表单提交，但 btnProcess 按钮仍然可以触发验证并在无效时停止该过程。