How to avoid double clicking on a submit button in .NET - c#

My c# web application has 2 panels. 1st panel is to enter some text.
The 2nd panel only shows after the 1st panel passes validation and the continue button is clicked.
The 2nd panel has a text box with 4 validations, a dropdown list box and a Submit button.
If the validation is good and the user clicks on he Submit button, I would like the Submit button to be disabled and change it's text to "Please wait..." to prevent the user from double clicking it.
I'm new to .NET so any help is greatly appreciated.
protected void BTNSubmit_Click(object sender, EventArgs e)
{
if (Page.IsValid)
{
BTNSubmit.Text = "Please wait...";
BTNSubmit.Enabled = false;
DoSomething();
}
}

This is something you will need to trap on the front end with javascript and asp.net's onclientclick attribute (which translates to javascript's onclick.)
An important key is that if your onclientclick returns false, your server event won't fire (which is what you want for the second click)
var submitted=false; //javascript variable to store if we have clicked submit yet
function ClientSubmit(obj){ //obj is your button
if(submitted) {return false;} //return false prevents server onclick from firing
submitted=true;
obj.value='Please Wait...';
obj.disabled = true;
return true;
}
Now the next time you click, your javascript will see that submitted is set to true, so this function will return false, and prevent the server event from firing
To implement this on your .aspx page
<asp:Button id="myButton" runat="server"
onclick="BTNSubmit_Click" onclientclick="return ClientSubmit(this);" Text="Submit"/>

Related

Bootstrap - open modal after postback only after button click c#

I have just implemented a modal popup on my site to capture email addresses. Once the user clicks the submit button the form is submitted. I am calling the modal again after a page.ispostback which works fine. However, I only want it to display after a user clicks that particular submit button. As this is on a master page, if someone goes to my 'Contact Us' page and submits a question on postback the modal reappears which I don't want. I literally only want it to appear after a postback from the submit form on the modal.
Any ideas how I can get around this?
Thanks
Rob
To display the modal only after the user clicks the submit button, you should put the modal's display logic only in this button's submit event.
Take the logic out of the Page_Load's IsPostBack, and put it at the end of this button's OnClick event
protected void Button_Click(object sender, EventArgs e)
{
// Do some work...
// Show modal
}

stop postback from code behind using c#

I have a button and I want to stop post back whenever someone clicks on that button.
I don't want to use return false like this
<asp:Button runat="server" Text="Click" OnClick="Unnamed1_Click" OnClientClick="javascript:return false;" />
I want to stop it from code behind.
I want to create a div and some content inside the div , so when ever someone click on that button another div will be created with it's contents, but the problem is when I click the button and a post back happen , it remove the first div and construct the second one and so on
Something you can do is to disable your button after a user click on them it also disable the postback behaviour and prevent future postback, in this way
protected void Unnamed1_Click(object sender, EventArgs e) {
YourButton.Enabled = false;
}

CausesValidation not working with custom validators

I have custom validators on the aspx page and user needs to see the error message in summary as soon as they tab out of the control.
To achieve this, I am calling Page_ClientValidate('') on onblur event of each control. One of the custom validator I have is:
function ValidateCustomerId(oSrc, args) {
var txtCustomerId = document.getElementById(txtCustomerId);
if (txtCustomerId != null) {
var customerId = txtCustomerId.value;
if (!isInteger(customerId)) {
document.getElementById("customerIdAsterik").style.display = 'inline';
args.IsValid = false;
}
else {
document.getElementById("customerIdAsterik").style.display = 'none';
}
}
}
If user enters invalid entry and clicks on Cancel button, server side event is not getting fired untill it is clicked twice. Cancel button already has CausesValidation=false. I think this behaviour is due to calling on Page_ClientValidate() on onblur event, otherwise it works fine.
Is there to skip the client validations when they click on cancel button or is there any approach I could take to achieve this.
Similar kind of issue is listed here:
http://weblogs.asp.net/gurusarkar/archive/2013/05/30/after-first-postback-why-i-have-to-click-the-button-twice-for-postback-to-occur.aspx
Not sure if that applies but the Validation is fired due to the onblur.
So I think setting that Page_Block=false in the button click might work.

enable button in C# by removing 'disabled' property using firebug

I have a question about disable button (C#) that I need your help.
in Asp.net (C#), disable the button code:
Button btn = new Button();
btn.click += new EventHandler(btn_click);
btn.Enabled = false;
btn.UseSubmitBehavior = false;
The generated HTML:
<input type="button" disabled="disabled">
The button is disabled until I use firebug and remove the 'disabled' property and change the type property to submit (<input type="submit">) then user can click on btn and it can perform btn_click method(postback).
How could we prevent this issue? I try to use CommandName (disable, enable) to mark disable button and inside btn_click method, I check if CommandName== "disable" then stop the function but it is very messy.
Thanks for your help.
Van
Client can remove the Disabled attribute but cannot change the control ViewState. On server side you can do that:
protected void btn_Click(object sender, EventArgs e)
{
if (btn.Enabled)
{
// do something
}
}
<asp:Button ID="btn" runat="server" Enabled="false" OnClick="btn_Click" Text="Test" />
You can't control your users' behavior.What you need to do is handle these things in server-side..
you can judge the button's status in btn_click.. and then do some work
#bystander is right. You need to check on the server whether that condition is correct. You can't rely on the client being 100% fool proof, and that's the exact reason why.
Can you hide the control instead, and reenable it on some future postback? Hiding doesn't actually render the control to the client at all.

Instantly disable Button on click

I'd like to instantly disable a Button after clicking it, so a User can't click it twice in short succession and fire the OnClick_Event twice in a row. btn.Enabled = false doesn't seem to do the trick instantly. Is there any other way to accomplish this?
Thanks,
Dennis
What you are doing is disabling it after a post back therefore your button will be disabled in the page that's rendered when the browser receives the response.
Do it on the client-side with JavaScript instead:
var button = document.getElementById('yourButton');
button.disabled = true;
If you're facing issues with posting back to the server, check out this article: How to disable an ASP.NET button when clicked.
function disable()
{
var button = document.getElementById('<%= Button1.ClientID %>');
button.disabled = true;
}
<asp:Button ID="Button1" OnClientClick="disable();">
you can achieve this via javascript
function Disable(btn)
{
btn.disabled = true;
}
and add this to your button OnClientClick="javascript:return Disable(this);"
You can handled it simply by this code.Suppose, here is a button named btnAdd.When you click this button it will be disable due to execute it's corresponding code.I mean due to post back it will be disabled.
if (!IsPostBack)
{
btnAdd.Attributes.Add("onclick", "this.disabled=true;" + GetPostBackEventReference(btnAdd).ToString());
}
Write the btn.Enabled= false at the end of all the functionality in the Onclick Event of the Button. It will do the Required action.
Disabling the button has raised on problem. You won't get the server side event fired. So better seek the alternative by hiding the button (and yes displaying some friendly error message 'working', 'processing' etc.). The work out on how to disable asp.net button on postback would help. Thanks.
YourButton.Enabled = false;
if(!YourButton.Enabled)
{
\\Your Code Here
YourButton.Enabled = true;
}
Hope this helps ;)

Categories