ASP .NET OnClick Fires wrong server side method

Question

Synopsis:

I have a login page has two bootstrap modals, one for registering a new account and one for logging into an existing account. Intermittently I'm seeing an issue where trying to log in results in the method for the registering submit button being fired instead of the method for the login button (the one clicked).

Details:

I'm going to describe some of the layout and post code where necessary. I'm trying to avoid posting a ton of code since I'm not exactly sure where the issue lies. This page is a childpage of the site.master, has multiple .css and .js files associated with the theme and the site functionality.

'signup-modal' modal includes a few input fields and then the submit button 'Button1', whose onclick parameter fires the server-side 'RegisterUser' method in the code behind file (C#).

'login-modal' modal includes inputs for username/password, a remember me checkbox, a login with facebook button and the submit button, whose onclick parameter fires the server-side 'ValidateUser' method in the code behind file (C#).

Each modal is surrounded by an UpdatePanel.

When a user has the login modal open and fills valid information then clicks the login button it will typically operate as expected, firing the 'ValidateUser' method, checking the information with the database and authenticating/redirecting the user to the content page. However, occasionally when clicking the login button the 'RegisterUser' method fires instead and returns an error I coded for when the DB tells it that the username entered already exists.

Unfortunately I can't seem to consistently recreate this error, but it does seem to be related to the authentication. I'm using FormsAuthentication to set authentication cookies for the user once they've been validated by the user database. I've noticed that when this error happens, if the cache is cleared, then you are able to login successfully.

What I don't understand is why anything in Session authentication should cause the wrong method to fire onclick. Especially since when it fires the button control it's associated with is hidden and should be inaccessible. The best I can figure is that somehow all onclick methods are being fired and because the 'RegisterUser' one is first in the html, that is the one being executed?

What I've Tried:

I had read a couple posts where people would see this type of behavior as a result of blank labels:

ASP.NET: Wrong event is fired when I click a LinkButton

I don't see anything like that in my code, however I did have a class="" call out in an ASP:Button control that was generating a warning about class="" not being a valid parameter. I tried removing that but didn't see any change in behavior.

I have included on both forms (in each modal) required field parameters, which I remove/add VIA javascript when the modal is hidden or shown. The reason I remove it is that an error is thrown if a required field is hidden due to the browser trying to find the control to validate and not seeing it. Since the 'RegisterUser' method fires without the browser trying to authenticate the associate fields I can surmise that the button is actually hidden (with the required parameters removed) and not just off screen or something.

I have tried without success to determine why this only happens intermittently. It doesn't seem to be due to the number of authenticated sessions under one username. I have logged into over 5 sessions on different computers/browsers without getting the error and had it happen on the first login attempt for a user.

Also, I can confirm that I've seen this error across Chrome, IE, Edge and Firefox, again intermittent on all.

I've double checked that the 'RegisterUser' method isn't being called anywhere else besides the onclick function of the register button.

I haven't been able to find any other posts similar to this, so I'm turning to you in desperation.

The Question:

So if you've made it through all that, here's the real question; What would cause the wrong OnClick method to fire? Am I correct in my educated guess that it has something to do with the Session authentication?

I would also appreciate some advice on where to take my troubleshooting from this point. I can post code snippets as necessary, I'm just not sure what would be relevant and given the volume of code I didn't want to just post it all.

Code Snippets:

The buttons:

Register Button:

<asp:Button ID="Button1" runat="server" onclick="RegisterUser" Text="Create Account" CssClass="btn btn w-lg btn-rounded btn-lg btn-custom waves-effect waves-light" />

Login Button:

<asp:Button ID="btnSubmit" runat="server" onclick="ValidateUser" Text="Sign In" CssClass="btn btn w-lg btn-rounded btn-lg btn-custom waves-effect waves-light" />

Outline of RegisterUser Method

protected void RegisterUser(object sender, EventArgs e)
{
    /* Code that registers user with database if username doesn't exists */
}

Outline of ValidateUser Method

protected void ValidateUser(object sender, EventArgs e)
{
    /* Code that validates user with the database and authenticates if valid. */
}

Please let me know if there is any more information that would be helpful to include and I'll update the question.

Thank you very much in advance.

UPDATE

I̶'̶v̶e̶ ̶f̶o̶u̶n̶d̶ ̶t̶h̶a̶t̶ ̶I̶'̶m̶ ̶a̶b̶l̶e̶ ̶t̶o̶ ̶r̶e̶p̶r̶o̶d̶u̶c̶e̶ ̶t̶h̶i̶s̶ ̶e̶r̶r̶o̶r̶ ̶1̶0̶0̶%̶ ̶w̶h̶e̶n̶ ̶r̶u̶n̶n̶i̶n̶g̶ ̶o̶n̶ ̶l̶o̶c̶a̶l̶h̶o̶s̶t̶ ̶a̶s̶ ̶o̶p̶p̶o̶s̶e̶d̶ ̶t̶o̶ ̶t̶h̶e̶ ̶d̶e̶v̶e̶l̶o̶p̶m̶e̶n̶t̶ ̶s̶e̶r̶v̶e̶r̶.̶ (Turns out this isn't the case)

Here's another odd behavior I seem to have stumbled upon. If I type out the user name and password, the RegisterUser method fires. However, if the username and password are filled by a password manager, the ValidateUser method is fired (Correct action).

Answer 1

Check your button declaration in your .aspx source.

If you have a 'runat=server' and onclick="RegisterUser", and you have an event handler in your code-behind, it will cause the event to be fired twice.

If so try to change this

  <asp:Button ID="Button1" runat="server" onclick="RegisterUser" 
   Text="Create Account" CssClass="btn btn w-lg btn-rounded btn-lg btn-
   custom waves-effect waves-light" />

To this

   <asp:Button ID="Button1" runat="server" Text="Create Account" 
   CssClass="btn btn w-lg btn-rounded btn-lg btn-custom waves-effect 
   waves-light" />

Some others say that adding type="submit" has helped them out.

Another case might be that your event handler in the server side might be causing the event to be triggered twice.

For instance if you have:

Protected Sub RegisterUser_OnClick(ByVal sender As Object, ByVal e As System.EventArgs) Handles RegisterUser_Click
'Do Something

End Sub

The Handles RegisterUser_Click might cause the event to be fired twice.

Nice explanation btw. Hope the best. Lets us know what was the issue. Best of luck.