www.webdeveloper.com
Results 1 to 6 of 6

Thread: Make text box visible is checked=true

  1. #1
    Join Date
    Dec 2011
    Posts
    79

    Make text box visible is checked=true

    I need a textbox to only show if option 2 is chosen and otherwise not show. I have googled it but cant get anything to work. thanks in advanced

    Code:
    <html>
    <head>
    
    <script type="text/javascript">
    function Validate() {
      if ((document.getElementById('yes').checked) {document.myForm.claim.style.visibility='visible'}
       
    }
    </script>
    </head>
    <body>
    
    <form name="myForm"  onsubmit="return Validate()">
    <input name="choice" id="yes" type="radio" value="1" />Choice One<br />
    <input name="choice" id="no"type="radio" value="2" />Choice Two<br />
    
    </br>Any accidents (Motor insurance Claims) or driving convictions in past 5 years if yes please give detail :</br>
    <textarea name="claim" style="visibility:hidden;" rows="5" cols="15"></textarea>
    		
    		</fieldset>
    <br>
    <input type="submit" value="Submit">
    </form>
    </body>
    </html>

  2. #2
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,350

    Lightbulb Something to consider...

    If I understand your logic, this should be close to your needs...
    Code:
    <html>
    <head>
    <script type="text/javascript">
    function showHide(IDS,status) {
      document.getElementById(IDS).style.visibility = status;
    }
    function Validate() {
      if ((document.getElementById('claimyes').checked)) {
        document.getElementById('claimText').style.visibility='visible';
      }
      return false;  // change to 'true' after testing
    }
    </script>
    </head>
    <body>
    
    <form name="myForm"  onsubmit="return Validate()">
    <label>
    <input name="choice" id="claimyes" type="radio" value="1" onclick="showHide('claimText','hidden')" />Choice One
    </label>
    <br />
    <label>
    <input name="choice" id="claimno" type="radio" value="2" onclick="showHide('claimText','visible')" />Choice Two
    </label>
    <br />
    
    <fieldset id="claimText" style="visibility:hidden;width:50%"><legend>Insurance Claim</legend>
    Any accidents (Motor insurance Claims) or driving convictions in past 5 years.<br>
    If yes please give details:</br>
    <textarea id="claim" name="claim" rows="5" cols="15"></textarea>
    </div>		
    </fieldset>
    <br>
    <input type="submit" value="Submit">
    </form>
    </body>
    </html>
    Good Luck!

  3. #3
    Join Date
    Feb 2012
    Posts
    61
    try this one...............
    you miss the one bracket...
    ((document.getElementById('yes').checked))
    as well we don't need to submit form... check this one it will be helpful for you.........


    <html>
    <head>

    <script type="text/javascript">
    function Validate() {
    if ((document.getElementById('yes').checked)) {document.myForm.claim.style.visibility='visible'}

    }
    </script>
    </head>
    <body>

    <form name="myForm">
    <input name="choice" id="yes" type="radio" value="1" />Choice One<br />
    <input name="choice" id="no"type="radio" value="2" />Choice Two<br />

    </br>Any accidents (Motor insurance Claims) or driving convictions in past 5 years if yes please give detail :</br>
    <textarea name="claim" style="visibility:hidden;" rows="5" cols="15"></textarea>

    </fieldset>
    <br>
    <input type="button" value="Submit" onclick="return Validate()">
    </form>
    </body>
    </html>

  4. #4
    Join Date
    Dec 2011
    Posts
    79
    Quote Originally Posted by JMRKER View Post
    If I understand your logic, this should be close to your needs...

    Good Luck!
    as well we don't need to submit form... check this one it will be helpful for you.........
    [/QUOTE]

    Thank you for the reply's, the files are on my work pc and ill test your codes when i get into work later. Also, the form this is on, is an email form, i cut most of it out, thats why the submit button is still there, i just forgot to cut it out

    Thank you very much, code works. Your both amazing, thank you very very much
    Last edited by chrisboots; 02-21-2012 at 01:51 AM.

  5. #5
    Join Date
    Dec 2011
    Posts
    79
    Quote Originally Posted by JMRKER View Post
    If I understand your logic, this should be close to your needs...



    BEAUTIFUL! Is there any chance you would know how to do this with a drop down box rather than radio ?

  6. #6
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,350

    Lightbulb Here you go ...

    Quote Originally Posted by chrisboots View Post
    BEAUTIFUL! Is there any chance you would know how to do this with a drop down box rather than radio ?
    Sure, but you ought to determine your requirements before you make a request...
    Code:
    <html>
    <head>
    <script type="text/javascript">
    function showHide(IDS,status) {
      if (status == '') { return; }
      document.getElementById(IDS).style.visibility = status;
    }
    </script>
    </head>
    <body>
    
    <select id="claim" onchange="showHide('claimText',this.value)">
     <option value="">Choose</option>
     <option value="visible">Choice One</option>
     <option value="hidden">Choice Two</option>
    </select>
    <br />
    
    <fieldset id="claimText" style="visibility:hidden;width:50%">
     <legend>Insurance Claim</legend>
     Any accidents (Motor insurance Claims) or driving convictions in past 5 years.<br>
     If yes please give details:</br>
     <textarea id="claim" name="claim" rows="5" cols="30"></textarea>
    </fieldset>
    <br>
    </body>
    </html>
    Good Luck!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles