Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 1 down vote favorite

I have the following button in an ASP.Net web form:

<asp:Button id="btn_submit" text="Submit (Click only Once)" OnClick="process_form" runat="server" />

In the page code, I have the following function which is used to disable multiple submits (this worked fine under ASP.Net 2.0) ...

private sub prevent_multiple_submits()

dim sb as StringBuilder

sb = New StringBuilder()

sb.Append( "this.value = 'Please wait...';this.disabled = true;" )
sb.Append( Page.ClientScript.GetPostBackEventReference( btn_submit, String.Empty ) )

btn_submit.Attributes.Add( "onclick", sb.ToString() )

end sub

When the page is run under ASP.Net 2.0 the HTML rendered is as follows (worked fine)...

<input type="submit" name="btn_submit" value="Submit (Click only Once)" onclick="this.value = 'Please wait...';this.disabled = true;__doPostBack('btn_submit','');" id="btn_submit" />

When the page is run under ASP.Net 4.0 the HTML rendered is as follows:

<input type="submit" name="btn_submit" value="Submit (Click only Once)" onclick="this.value = &#39;Please wait...&#39;;this.disabled = true;__doPostBack(&#39;btn_submit&#39;,&#39;&#39;);" language="javascript" id="btn_submit" />

... and for some reason, the button never appears as disabled ... (like it did under ASP.Net 2.0) ...

The form still submits and everything works -- but the button NEVER APPEARS DISABLED after being clicked on ?!

Has anyone else dealt with this behaviour ?? .. and if so, did you find a solution without resorting to altering web.config, using JQuery, etc.

BTW,

I did find the following references; but nothing has worked yet for me under ASP.Net 4.0.

ASP.NET, javascript: silly annoying apostrophe problem

HTMLEncode/HTMLDecode and the apostrophe ASP.net

I guess the question should be how does one add unescaped javascript code to an asp.net button?

Thanks in advance

share|improve this question

2 Answers

up vote 0 down vote

You can avoid this by removing the prevent_multiple_submits sub entirely and adding an onClientClick attribute to your button:

<asp:Button id="btn_submit" text="Submit (Click only Once)" OnClick="process_form" runat="server" onClientClick="this.value = 'Please wait...';this.disabled = true;" />

Though I would take it a step further:

onClientClick="disable(this)"

<script type="text/javascript">
    function disable(elem) {
        elem.value = "Please wait...";
        elem.disabled = true;
    }
</script>

Or using jQuery, remove the onClientClick too:

$(document).ready(function() {
    $('form').submit(function() {
        $('input[id^="btn_submit_"]').prop('disabled', true).val('Please wait...');
    });
});

Another jQuery solution that hides the button instead of disabling:

$(document).ready(function() {
    $('form').submit(function() {
        var btn = $('input[id^="btn_submit_"]');
        btn.after('<span>Please wait...</span>');
        btn.hide();
    });
});

Of course both jQuery solutions are possible in vanilla js, but the syntax is more verbose, you'd have to look it up.

share|improve this answer
 
Hi Jason - thanks for taking the time to answer. I tried a test using the "onClientClick" code above -- unfortunately, it does not work -- the problem is the submit button becomes disabled and the "process_form" is never executed. I would prefer an ASP.Net only solution rather than having to resort to JQuery –  user1377587 Jul 14 at 19:15
 
Has anyone using ASP.Net 4.0 done this??? Is it even possible WITHOUT using JQuery? –  user1377587 Jul 14 at 19:16
 
@user1377587 The first two solutions I gave don't use jQuery. So that's a different issue, where disabling the button causes the form to not submit. After a little research, I'm not sure how your solution worked in the past (maybe that's another difference between 2.0 and 4.0). You could instead hide the button and append a span with text saying "Please wait". I've edited to add that solution. –  Jason P Jul 14 at 20:00
 
Acknowledged -- I was just hoping for a "pure" ASP.Net solution -- thanks again ! –  user1377587 Jul 14 at 20:27
 
What do you consider a "pure" asp.net solution? Because even your original (2.0) code used javascript. –  Jason P Jul 14 at 20:28
show 1 more comments
up vote 0 down vote accepted

Ok,

I feel kind of dumb, because after experimenting a bit, it appears that although ASP.Net 4.0 renders differently than ASP.Net 2.0 -- the code was actually still working. That is the button IS disabled -- it just never APPEARS that way.

The problem was when the button was disabled via javascript, there was no visual clue that it was happening, ie: the button did not appear "greyed out" as in previous versions. To confirm this, I changed the prevent_multiple_submits subroutine as follows:

private sub prevent_multiple_submits()

dim sb as StringBuilder

sb = New StringBuilder()

sb.Append( "this.disabled=true;this.style.backgroundColor='#EFEFEF';this.style.color='#000000';this.value='Please wait...';" )
sb.Append( Page.ClientScript.GetPostBackEventReference( btn_submit, String.Empty ) )

btn_submit.Attributes.Add( "onclick", sb.ToString() )

end sub

Now -- when the button is clicked, the button changes to grey (to indicate it is disabled) -- which used to happen under ASP.Net 2.0 AUTOMATICALLY. Without the color change -- the button never appears disabled (even though it is) -- this is the difference between 2.0 and 4.0 rendering.

Hope this helps someone else.

Thanks again.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.