Show/Hide with Radio Buttons in a form. [Archive]

lrickyutah

08-13-2008, 10:49 PM

I'm looking for something similar to the Form Dependency Manager

http://dynamicdrive.com/dynamicindex16/formdependency.htm

I'm looking to create a form similar to this, but when a radio button is clicked I'd like it to display "correct" or "incorrect" next to the button.

I'd tried editing this script to suit my needs, but this script does much more than I need it to. Is there a similar script in DD? or does anyone know of a different script on a different site?

lrickyutah

08-14-2008, 10:04 PM

Thanks, that doesn't quite help me. I'm a noob.

I did find this . . . which I can modify to work for me.

<html>
<head>
<title>RB Tabs</title>
<style type="text/CSS">
div.RBtnTab { display:none; height:100px; width:200px; background-color:yellow}
</style>
<script type="text/javascript">
// getElementByClass function from http://www.webmasterworld.com/forum91/1729.htm
//Create an array
var allPageTags = new Array();

function doSomethingWithClasses(theClass) {
//Populate the array with all the page tags
var allPageTags=document.getElementsByTagName("*");
//Cycle through the tags using a for loop
for (var i=0; i<allPageTags.length; i++) {
//Pick out the tags with our class name
if (allPageTags[i].className==theClass) {
//Manipulate this in whatever way you want
allPageTags[i].style.display='none';
}
}
}

function Show(ids) {
doSomethingWithClasses('RBtnTab');

var obj = document.getElementById(ids);
if (obj.style.display != 'block') { obj.style.display = 'block'; }
else { obj.style.display = 'none'; }
}
</script>
</head>
<body>

<label for="lDIV1">
<input id="lDIV1" type="radio" name='rbtab' value='DIV1' onClick="Show('DIV1')">Event Info</label>
<label for="lDIV2">
<input id="lDIV2" type="radio" name='rbtab' value='DIV2' onClick="Show('DIV2')">Plan Event</label>
<label for="lDIV3">
<input id="lDIV3" type="radio" name='rbtab' value='DIV3' onClick="Show('DIV3')">Contact Us</label>
<div id='Content' style="display:block"><br />
<div id='DIV1' class="RBtnTab">Event Information</div>
<div id='DIV2' class="RBtnTab">Plan Event Information</div>
<div id='DIV3' class="RBtnTab">Contact us at: xxx</div>
</div>
</body>
</html>