SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Zealot malluwood's Avatar
    Join Date
    Nov 2006
    Posts
    114
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Exclamation show and hide on radio buttons

    hi

    i have two radio buttons named as 'yes' and 'no

    if somebody clicked on " yes '' radio button i have to display a two listbox (that contains dynmic value from mysql using php).

    if the person clicks on 'no'.these two listboxex should be disapper

    I thin i have to use show and hide techniques in javascript.but i have no idea how to do.

    please help me

    Thanks

  2. #2
    SitePoint Evangelist bals28mjk's Avatar
    Join Date
    Aug 2007
    Posts
    405
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Use onclick event. Then in your JavaScript code use
    Code:
    if(reference.checked==true){
    reference.style.visibility="hidden"; }
    else{
    reference.style.visibility="visible";}
    e.g document.getElementById("myradiobuttonid").style.visibility="hidden".

  3. #3
    SitePoint Zealot malluwood's Avatar
    Join Date
    Nov 2006
    Posts
    114
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    But its not working

    HTML Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Untitled Document</title>
    </head>
    
    <body>
    
    <form name="form1" method="post" action="">
      <p>yes
        <input name="radiobutton" type="radio" value="radiobutton" onClick="sho(form1.radiobutton)"> 
      NO 
      <input name="radiobutton" type="radio" value="radiobutton">
    </p>
      <p>textbox 
        <input type="text" name="tname" id="tname">
    </p>
    </form>
    </body>
    </html>
    <script language="javascript">
    function sho(radiobutton)
    {
    
    if(radiobutton.checked==true)
    {
    document.getElementById("tname").style.visibility="visible";
    
    }
    else
    {
    document.getElementById("tname").style.visibility="hidden";
    }
    
    }
    
    </script>

  4. #4
    SitePoint Zealot malluwood's Avatar
    Join Date
    Nov 2006
    Posts
    114
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I got the solution





    HTML Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Untitled Document</title>
    </head>
    
    <body>
    
    <form name="form1" method="post" action="">
      <p>yes
        <input name="radiobutton" type="radio" value="1" onClick="sho(form1.radiobutton)"> 
      NO 
      <input name="radiobutton" type="radio" value="2" onClick="sho(form1.radiobutton)" >
    </p>
      <p>textbox 
        <input type="text" name="tname" id="tname">
    </p>
    </form>
    </body>
    </html>
    <script language="javascript">
    function sho(radiobutton)
    {
    
    
    for (var i=0; i < document.form1.radiobutton.length; i++)
       {
       if (document.form1.radiobutton[i].checked)
          {
          var rad_val = document.form1.radiobutton[i].value;
    alert(rad_val);
    	  }
       }
    
    if(rad_val==1)
    {
    
    document.getElementById("tname").style.visibility="visible";
    
    }
    else if(rad_val==2)
    {
    document.getElementById("tname").style.visibility="hidden";
    }
    
    }
    
    </script>

  5. #5
    SitePoint Zealot malluwood's Avatar
    Join Date
    Nov 2006
    Posts
    114
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks bals28mjk

  6. #6
    SitePoint Zealot malluwood's Avatar
    Join Date
    Nov 2006
    Posts
    114
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have other problem here

    This code just hides the input box.But the label is not hiding.what is the problem here

  7. #7
    SitePoint Zealot malluwood's Avatar
    Join Date
    Nov 2006
    Posts
    114
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I solved by using div

    Thanks to every one

  8. #8
    SitePoint Evangelist bals28mjk's Avatar
    Join Date
    Aug 2007
    Posts
    405
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)


Bookmarks

Posting Permissions

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