Java script in HTML forms

**gemzilla** · 06-21-2012, 10:11 AM

I have this code which consists of a check box and when a user checks it some radio buttons pop down. I would like it so that when they un check it removes in checked radio buttons and then makes the radio buttons dissapear.

This is the code I have a the moment:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<style type="text/css">
/*<![CDATA[*/

.answer {
  overflow:hidden;display:none;
}

/*]]>*/
</style>

<script type="text/javascript">
/*<![CDATA[*/

function zxcShow(id,closelast){
 var obj=document.getElementById(id);;
 if (closelast&&zxcShow.lst){
  zxcShow.lst.style.display='none';

 }
 obj.style.display='block';
 zxcShow.lst=obj;
}


/*]]>*/
</script>

</head>

<body>
<table width="166" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="166" valign="top"><span class="Text">
            <input name="Question" type="checkbox" id="question" value="Question" onmouseup="zxcShow('b2',true);" /> 
            Question
</span></td>
        </tr>
        <tr>
          <td height="19" valign="top">
          
          <div id='b2' class="answer">
            <p><strong>I hold:</strong></p>
            <p>Answer 1 
              <input type="radio" name="radio" id="answer1" value="Answer 1" />
            </p>
            <p>Answer 2 
              <input type="radio" name="radio" id="answer2" value="Answer 2" />
            </p>
            <p>Answer 3
              <input type="radio" name="radio" id="answer3" value="Answer 3" />
            </p>
          </div></td>
        </tr>
      </table>
</body>
</html>

**vwphillips** · 06-21-2012, 11:34 AM

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<style type="text/css">
/*<![CDATA[*/

.answer {
  overflow:hidden;display:none;
}

/*]]>*/
</style>

<script type="text/javascript">
/*<![CDATA[*/

function zxcShow(cb,id){
 var obj=document.getElementById(id);;
 obj.style.display=cb.checked?'block':'none';
 cb.style.display=cb.checked?'block':'none';
}


/*]]>*/
</script>

</head>

<body>
<table width="166" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="166" valign="top"><span class="Text">
            <input name="Question" type="checkbox" id="question" value="Question" onclick="zxcShow(this,'b2');" />
            Question
</span></td>
        </tr>
        <tr>
          <td height="19" valign="top">

          <div id='b2' class="answer">
            <p><strong>I hold:</strong></p>
            <p>Answer 1
              <input type="radio" name="radio" id="answer1" value="Answer 1" />
            </p>
            <p>Answer 2
              <input type="radio" name="radio" id="answer2" value="Answer 2" />
            </p>
            <p>Answer 3
              <input type="radio" name="radio" id="answer3" value="Answer 3" />
            </p>
          </div></td>
        </tr>
      </table>
</body>
</html>

Thread: Java script in HTML forms

Thread Tools

Search Thread

Java script in HTML forms

Bookmarks

Bookmarks

Posting Permissions