Prevent other asp buttons from performing submit action

Question

I'm building an upload form. Along with uploading, the user needs to enter some data and may or may not to work with a cart. The cart buttons remove a listing from the cart or empty the cart entirely. However, when I attempt to use these buttons, the page performs the submit action I have indicated, return 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>

That is not the complete form by the way. I tried to use this... UseSubmitBehavior="false" , but it doesn't work in the way I thought it might. Here are the code behind functions I'm trying to use....

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();
    }
}

I apparently cannot use PageFunctions or Ajax to call the code-behind functions because they are not static and don't return anything.

I also cannot split the form into two forms, because an asp page cannot have two forms with runat=server and because I'm using a python cgi script which seems to only recover the elements of one form not two.

Any ideas on what I can do? The only thing I can come up with is that I'll have to have two forms, one basic html form and one asp.net form. For the cart in the asp.net form, I'll need to add a hidden listbox in the html form and functionality to update it when the cart is updated.

score 0 · Answer 1 · answered Dec 22 '14 at 22:51

0

It looks like you are manually creating the HTML markup for the form (which is good). Instead of decorating the form with the

onSubmitEvent="return validateForm()",

instead set it to be

onSubmit="return false"

This will cause the form incapable of submitting anything unless programmatically told to do so. Next, you add some JS to the button that you want to actually handle you validation and submission like this

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

...

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

answered Dec 22 '14 at 22:51

Peter Lange

2,786
2
26
40

If I set this... onSubmit="return false" I can't use
– razor_nate Dec 23 '14 at 21:39
Hey @razor_nate, if you are relying on server side event handlers for those buttons, then you are correct. You cannot stop the form from submitting in that manner. You would simply remove the onSubmit="return false" which will allow the other buttons to still cause the form to submit, but the btnProcess button can still trigger validation and stop the process if invalid. – Peter Lange Dec 30 '14 at 05:58

Prevent other asp buttons from performing submit action

1 Answers1