Category >
JQUERY
|| Published on :
Friday, January 26, 2018 || Views:
10395
||
jquery disable button click event hide submit button after click jquery disable button after click html
Introduction
Here Pawan Kumar will explain how to In certain conditions in application we want disable submit button after first click to avoid multiple submission of form or disable button after click in html
Description
In previous post I have explained
Set or Display Watermark Text for ASP.Net TextBox, Password and MultiLine TextArea using jQuery in ASP.Net with demo and Example codes,
Create Login Page In ASP.NET Web Application Using ASP.Net, C# And SQL Server,
Perserve/Retain state for dynamically created ASP.Net Dynamic Controls ViewState on PostBack,
Allow only AlphaNumeric ( Alphabets and Numbers) characters and space only in TextBox using Javascript and jQuery(Example & Demo),
Export HTML Table to PDF in ASP.Net with C# using iTextSharp DLL Library,
GridView in ASP.Net using c# tutorial, and many more articles.
Now I will explain How to Disabled submit button after clicked using jQuery with example
So follow the steps to learn Disabled submit button after clicked using jQuery with example
In certain conditions in application we want disable submit button after first click to avoid multiple submission of form or disable button after click in html. In this example we are using jQuery to complete our task.
Simply code we will write to disable submit button after form submission in jQuery is to disable the button after it is clicked
Complete code to hide submit button after click jquery
<!DOCTYPE html>
<html lang="en">
<body>
<h1>jQuery - How to disabled submit button after clicked</h1>
<form id="sub" action="#" method="POST">
<input type="submit" id="btnSubmit" value="Submit"></input>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<input type="button" value="test button" id="btnTest"></input>
<script>
$(document).ready(function () {
$("#sub").submit(function (e) {
//stop submitting the form to see the disabled button effect
e.preventDefault();
//disable the submit button
$("#btnSubmit").attr("disabled", true);
//disable a normal button
$("#btnTest").attr("disabled", true);
return true;
});
});
</script>
</body>
</html>
Conclusion:
So, In this tutorial we have learned, Disabled submit button after clicked using jQuery with example