How to add a listener on a text field with javascript?

Discussion in 'JavaScript' started by 123GoToAndPlay, Jan 16, 2008.

  1. #1
    Hi all,

    I think i need JS for the following:

    I have a form with 2 textfields disabled, now if an user put the right word in textfield3 the other 2 textfields will be enabled.

    How do i do this??
     
    123GoToAndPlay, Jan 16, 2008 IP
  2. jwlnewsome

    jwlnewsome Peon

    Messages:
    18
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    wrap the first two text boxes in a div tag with the css dispaly set to hidden
    then create a function in js that compares the value of the third text field
    create a 'onKeyup' event to call that function

    function show_text_box(value){
    if (value == 'word'){
    elem = document.getElementById("hidden");
    elem.style.visibility = visible;
    }
    }

    <div id= "hidden" style="visibility:hidden">
    <input name="textbox1" type="text" value="" "/>
    <input name="textbox2" type="text" value="" "/>
    </div>

    <input name="textbox3" type="text" value="" onkeyup="show_text_box(document.form.textbox3.value);"/>

    may need debugging but it will give you an idea
     
    jwlnewsome, Jan 16, 2008 IP
  3. rkquest

    rkquest Well-Known Member

    Messages:
    828
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    140
    #3
    ^ yup it needs debugging.. :D
    Since I'm bored, let me help out and give a working version.

    
    <script>
    function show_text_box(value){
    if (value == 'word'){
    elem = document.getElementById("hidden");
    elem.style.visibility = 'visible';
    }
    }
    </script>
    
    <div id= "hidden" style="visibility:hidden">
    <input name="textbox1" type="text" value="" />
    <input name="textbox2" type="text" value="" />
    </div>
    
    <input name="textbox3" type="text" value="" onkeyup="show_text_box(this.value);"/>
    
    HTML:
     
    rkquest, Jan 17, 2008 IP