Rss Feed Like Us on facebook Google Plus

July 4, 2013

Disable Button after once Click by Javascript

Disable Button after clicking on it.If when you set disabled="disabled" immediately after
the user clicks the button, and the form doesn't submit because before form submission button is already diasabled..

Uses- It prevents double form submission/ prevent double postback


 you could try these things

1st Way...

//JAVASCRIPT
<script type="text/javascript">
function disable() {
            var v = confirm('Are you sure to save');
            if (v == true) {
                setTimeout(function () { document.getElementById('<%= btnSave.ClientID %>').disabled = true }, 1);
                return true;
            }
            return false;
        }
 
        function preventBack() { window.history.forward(); }
        setTimeout(function () { preventBack() }, 0);
        window.onunload = function () { null };
</script>
//HTML
<input type="button" id="btnsave" runat="server" value="Save" onclick="javascript:disable()" />
2nd Way

myInputButton.disabled = "disabled";
myForm.submit()
Whether it be due to a users lack of tech know-how or a twitch of the finger, a secondary click of a forms ‘Submit’ button could result in the form being submitted twice. Depending on the action of the form this could in turn send two enquiries, create two orders or insert a record into the database twice.

3rd Way

<input type="submit" name="Submit" value="Submit" onclick="this.disabled=true; this.value='Please Wait...';" /> 

4th Way
We can also use AJAX to disable postback element on Request Begin to prevent multiple clicks.

<form id="form1" runat="server">
<asp:scriptmanager id="sc" runat="server" enablepartialrendering="true">  
</asp:scriptmanager>
<script type="text/javascript">
    Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(beginReq);
    function beginReq(sender, args) {
        document.getElementById('<%= lblMessage.ClientID %>').innerText = "Processing.....";
        args.get_postBackElement().disabled = true;
    }  
</script>
<asp:updatepanel id="updpnlSubmit" runat="server">  
    <ContentTemplate>  
        <asp:Button ID="btnSubmit" Text="Submit" runat="server" OnClick="btnSubmit_Click" />  
        <asp:Label ID="lblMessage" runat="server"></asp:Label>  
    </ContentTemplate>  
</asp:updatepanel>
</form>

© 2011-2016 Techimpulsion All Rights Reserved.


The content is copyrighted to Tech Impulsion and may not be reproduced on other websites.