Thursday 28 January 2016

Disable Submit button after one click using JavaScript and jQuery in asp.net

disable submit button

Description:

In this example we explain that how to disable button or submit button after one click on the button using JavaScript or jQuery.

Sometime we have requirements like user can click the button only once time like for example in company online attendees when user login and click mark to fill up his/her present in these scenario when employee click mark to present button then his/her attendees will be present and the click mark present button will automatically disabled.

Here we demonstrate how to disable button using JavaScript and jQuery in asp.net.

So implement this type of functionality in your application below is the easy code for you
Code:-

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DisableButton.aspx.cs" Inherits="WebApplication1_WebApplication1_DisableButton" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Disable Button and Submit button after one click using JavaScript and jQuery
    </title>
</head>
<body>
    <form action="http://aspsolutionkirit.blogspot.in/">
    <fieldset>
        <legend>Using Javascript</legend>
        <input type="submit" id="btnSubmit" value="Submit" />
        <script type="text/javascript">
            window.onbeforeunload = function () {
                var inputs = document.getElementsByTagName("INPUT");
                for (var i = 0; i < inputs.length; i++) {
                    if (inputs[i].type == "submit") {
                        inputs[i].disabled = true;
                    }
                }
            };
        </script>
        <div style="background-color: #0000FF; color: #FFFFFF">
            Devloped By : http://aspsolutionkirit.blogspot.in/
        </div>
    </fieldset>
    <fieldset>
        <legend>Using JQuery</legend>
        <input type="submit" id="Submit1" value="Submit" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script type="text/javascript">
            $(window).on('beforeunload', function () {
                $("input[type=submit]").prop("disabled", "disabled");
            });
        </script>
        <div style="background-color: #0000FF; color: #FFFFFF">
            Devloped By : http://aspsolutionkirit.blogspot.in/
        </div>
    </fieldset>
    </form>
</body>
</html>



1 comments:

  1. sir your code is really good but in my case...

    i hope sir you can help me.. as soon as possible
    sir my problem is like as below : (


    sir, I was tried many code as well as your code but problem is like " when i try to click on submit button at that time it will be disable but when will be i try to refresh entire page then it will be see..

    PLEASE
    TRY TO UNDERSTAND MY PROBLEM AND I HOPE YOU GIVE A APPROPRIATE ANSWER...

    I AM WAITING FOR YOUR ANSWER... : )

    ReplyDelete