By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
448,798 Members | 1,395 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 448,798 IT Pros & Developers. It's quick & easy.

how to enable/disable textbox in JavaScript

P: 35
Javascript help

hi guyz i have a question how can i disable all my textbox in my form if my verification code is not correct? e.g(my verification code is " ng075 " if ng075 is not put in my textbox then the other textbox must be disable..all suggestion are well appreciated..thanks guys in advance i'm really having a hard time right now:(
Apr 19 '12 #1

✓ answered by Bharat383

Expand|Select|Wrap|Line Numbers
  1. <head>
  2. <script type="text/javascript">
  3.     function kk1()
  4.     {
  5.         document.getElementById("txt1").disabled  = true;
  6.     }
  7.     function kk2()
  8.     {
  9.         document.getElementById("txt1").disabled  = false;
  10.  
  11.     }
  12. </script>
  13. </head>
  14. <body>
  15.     <input type="button" name="btn1" id="btn1" onclick="kk1()"  value="Disable" />
  16.     <input type="button" name="btn2" id="btn2" onclick="kk2()" value="Enable" />
  17.     <br />
  18.     <input type="text" name="txt1" id="txt1" value="" />
  19. <body>

Share this Question
Share on Google+
6 Replies


P: 4
I will offer a JQuery script as the Javascript is a bit long and it is SO simple in JQuery.

First lets include the JQuery Library from Google.
Expand|Select|Wrap|Line Numbers
  1.  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
Next lets assume you verification code input box has an attribute ID="VerifyCD".

We add a functiuon to fire OnBlur (when you leave the verification text box) that will check the code and enable/disable all other input text boxes:

Expand|Select|Wrap|Line Numbers
  1. $('#VerifyCD).blur(function() {
  2.     if ($('#VerifyCD).val() <> "ng075" ) {
  3.         $('input:text').attr('disabled', true);
  4.         $('#VerifyCD).removeAttr('disabled');
  5.     } else {
  6.         $('input:text').removeAttr('disabled');
  7.     }
  8.  
  9. });
How it works:
$('#VerifyCD).blur(function() just means when the user leaves the VerifyCD textbox, run this function.

if ($('#VerifyCD).val() <> "ng075" ) just says if the value they entered is NOT your verify code then
$('input:text') take all text input boxes
.attr('disabled', true); and set their disable attribute to true
Expand|Select|Wrap|Line Numbers
  1. $('#VerifyCD).removeAttr('disabled');
alweays re-enable our VerifyCD text box

Expand|Select|Wrap|Line Numbers
  1. } else {
$('input:text') take all text input boxes
.removeAttr('disabled'); and remove their disable attr
}

I know it is not quite what you asked for, but I hope that helps.

Sean
Apr 19 '12 #2

P: 4
YIKES ...
Everywhere I said $('#VerifyCD)
it should be: $('#VerifyCD')
sorry, I missed the closing quote.
Apr 19 '12 #3

P: 35
thanks Sean for the rply i'll be in touch with you i'll try it first if it will work..thanks again
Apr 20 '12 #4

P: 93
Expand|Select|Wrap|Line Numbers
  1. <head>
  2. <script type="text/javascript">
  3.     function kk1()
  4.     {
  5.         document.getElementById("txt1").disabled  = true;
  6.     }
  7.     function kk2()
  8.     {
  9.         document.getElementById("txt1").disabled  = false;
  10.  
  11.     }
  12. </script>
  13. </head>
  14. <body>
  15.     <input type="button" name="btn1" id="btn1" onclick="kk1()"  value="Disable" />
  16.     <input type="button" name="btn2" id="btn2" onclick="kk2()" value="Enable" />
  17.     <br />
  18.     <input type="text" name="txt1" id="txt1" value="" />
  19. <body>
Apr 21 '12 #5

P: 1
First Create html page with 2 button and 1 textbox.this tutorial learn about the Text box disable using javascript.if Yes Button is click, the TextBox enabled and if No Button is click the TextBox disabled.

this article I will Learn with an example, How to Enable or Disable TextBox on Button Click using JavaScript. if Yes Button is click, the TextBox enabled and if No Button is click the TextBox disabled.
Feb 18 '20 #6

100+
P: 111
I wrote the code as requested by ehpratah.
Expand|Select|Wrap|Line Numbers
  1. <head>
  2. <script type="text/javascript">
  3. function changeDisabled(){
  4.   var obj_1 = document.getElementById("txt1");
  5.   var obj_2 = document.getElementById("txt2");
  6.   var obj_3 = document.getElementById("txt3");
  7.   if(obj_1.value == "ng075"){
  8.     obj_2.disabled = false;
  9.     obj_3.disabled = false;
  10.   }else{
  11.     obj_2.disabled = true;
  12.     obj_3.disabled = true;
  13.   }
  14. }
  15. </script>
  16. </head>
  17. <body>
  18.   <input type="text" value="" id="txt1" />
  19.   <input type="text" value="" id="txt2" disabled />
  20.   <input type="text" value="" id="txt3" disabled />
  21.   <input type="button" value="Button" id ="btn1" onclick="changeDisabled();" />
  22. </body>
Feb 18 '20 #7

Post your reply

Sign in to post your reply or Sign up for a free account.