Dynamic forms, show/hide layers

C

chris_huh

I have a script which means that when a certain radio button is clicked
more form options that relate to that radio button show up.

The form is layered in way that means that if you answer one question a
DIV appears that contains another question which itself when ansered
brings up another DIV.

The only problem i have is that i need to have the first DIV to remain
visible after the second question is answered, at the moment it
disappears, which makes sense since the hideAll function does that. I
guess what i need to do is have another line in the onClick property of
the second question radio button, but i don't know whether i need to
write a new function or not.

I hope you understand what i mean, and i hope someone has an idea how
to fix it.


The script i am using is shown below:

<script type="text/javascript">
<!--

// function switchDiv()
// this function takes the id of a div
// and calls the other functions required
// to show that div
//
function switchDiv(div_id)
{
var style_sheet = getStyleObject(div_id);
if (style_sheet)
{
hideAll();
changeObjectVisibility(div_id,"visible");
}
else
{
alert("sorry, this only works in browsers that do Dynamic HTML");
}
}

// function hideAll()
// hides a bunch of divs
//
function hideAll()
{
changeObjectVisibility("residential","hidden");
changeObjectVisibility("commercial","hidden");
changeObjectVisibility("house","hidden");
}

// function getStyleObject(string) -> returns style object
// given a string containing the id of an object
// the function returns the stylesheet of that object
// or false if it can't find a stylesheet. Handles
// cross-browser compatibility issues.
//
function getStyleObject(objectId) {
// checkW3C DOM, then MSIE 4, then NN 4.
//
if(document.getElementById && document.getElementById(objectId)) {
return document.getElementById(objectId).style;
}
else if (document.all && document.all(objectId)) {
return document.all(objectId).style;
}
else if (document.layers && document.layers[objectId]) {
return document.layers[objectId];
} else {
return false;
}
}

function changeObjectVisibility(objectId, newVisibility) {
// first get a reference to the cross-browser style object
// and make sure the object exists
var styleObject = getStyleObject(objectId);
if(styleObject) {
styleObject.visibility = newVisibility;
return true;
} else {
// we couldn't find the object, so we can't change its visibility
return false;
}
}
// -->
</script>

thanks
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,733
Messages
2,569,440
Members
44,832
Latest member
GlennSmall

Latest Threads

Top