blogspot visit counter

Friday, 15 March 2013

Enable or Disable a Controls Like Button, Textbox, Checkbox

JavaScript - Enable or Disable a Controls Like Button, Textbox, Checkbox

JavaScript - Enable or Disable a Controls Like Button, Textbox, Checkbox

Categories:  Javascript | Jquery

                  
Introduction

Here I will explain how to enable or disable a button control in JavaScript or Enable/Disable a controls in JavaScript. 

Description:
  
In previous articles I explained JavaScript Enable/Disable button based on text in textboxes,
jQuery Shake image on mouse over, jQuery upload multiple files usingmultiple file upload plugin, jQuery fancy switch on and off effectsexampleand many articles relating to JavaScript, jQuery, asp.net. Now I will explain how to enable or disable a button control in JavaScript.
To set controls enable or disable in JavaScript we need to write the code like as shown below

Enable control in JavaScript
document.getElementById('btnButton').disabled = false;
Disable control in JavaScript
document.getElementById('btnButton').disabled = true;
If you want to see it in complete example check this code
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Enable or Disable a control in javascript</title>
<script language="javascript" type="text/javascript">
//function to enable button if two textboxes contains text
function SetButtonStatus() {
var txt = document.getElementById('txtfirst');
//Condition to check whether user enters text in two textboxes or not
if (txt.value.length >= 1)
document.getElementById('btnButton').disabled = false;
else
document.getElementById('btnButton').disabled = true;
}
</script>
</head>
<body>
<div>
<input type="text" id="txtfirst" onkeyup="SetButtonStatus(this,'btnButton')"/>
<input type="button" id="btnButton" value="Button" disabled="disabled" />
</div>
</body>
</html>
Live Demo

For live demo enter text in textbox whenever we enter text button will enable otherwise it’s in disable mode


Enter Text  Button

No comments:

Post a Comment

Related Posts Plugin for WordPress, Blogger...