Click to See Complete Forum and Search --> : Hiding form elements


HosoiRamen
09-09-2003, 09:24 AM
I'm trying to hide a select list when one option in a different select list is selected and show it when another is selected. I just can't figure out how to hide a select list or a text field for that matter. Any ideas?

Khalid Ali
09-09-2003, 10:19 AM
Try this link below,I hope it helps

http://www.webapplikations.com/pages/html_js/forms/FormFieldsHiddenBySelectionBox.html

Fang
09-09-2003, 10:20 AM
This (http://forums.webdeveloper.com/showthread.php?s=&threadid=16983) is basic hide/show using a class change.

HosoiRamen
09-09-2003, 10:27 AM
Thanks Khalid, that's what I was looking for.

Khalid Ali
09-09-2003, 10:38 AM
:D
you are welcome

HosoiRamen
09-09-2003, 10:43 AM
Your ideas worked. My problem now is that I can't figure out how to align the elements correctly.
I'm trying to have both a drop down list of states for the United States and a text field for foreign countries aligned to the left in a table. When I hide the select list of states though, it just hides it, so the text field is still to the right of the table.

Here's the applicable code:

<SCRIPT LANGUAGE=JavaScript>
function test() {
if (document.ContactForm.COUNTRY.options[document.ContactForm.COUNTRY.options.selectedIndex].value > 1) {
document.ContactForm.STATE.style.visibility = "hidden";
document.ContactForm.PROVINCE.style.visibility = "visible";
} else {
document.ContactForm.STATE.style.visibility = "visible";
document.ContactForm.PROVINCE.style.visibility = "hidden";
}
}
</SCRIPT>

<TD VALIGN=TOP align=left>
<SELECT NAME=STATE>
<OPTION VALUE="AL">Alabama</OPTION>
<OPTION VALUE="WY">Wyoming</OPTION>
</SELECT>
<input type=text name=PROVINCE size=3 maxlength=5>
</TD>

The code makes the select list hidden, it doesn't make appear as though it's not there in code though.

HosoiRamen
09-09-2003, 10:46 AM
Nevermind, I found the display attribute. Sorry if I wasted your time.