Classic ASP Discussion - Dynamic visibilty

Print Page | Close Window

Dynamic visibilty

Printed From: Web Wiz Forums
Category: General Discussion
Forum Name: Classic ASP Discussion
Forum Description: Discussion on Active Server Pages (Classic ASP).
URL: https://forums.webwiz.net/forum_posts.asp?TID=14030
Printed Date: 30 March 2026 at 2:51pm
Software Version: Web Wiz Forums 12.08 - https://www.webwizforums.com

Topic: Dynamic visibilty

Posted By: ub3rl337ch3ch
Subject: Dynamic visibilty
Date Posted: 28 February 2005 at 12:34am

I know messing with visibility is usually done with javascript, thanks to an overabundance of wizards in frontpage and dreamweaver, but i need to make some fields in a form visible or hidden (or disabled/not)depending on the value selected in a dropdown box. Aside from doing an onchange post/submit, and then doing "if select = blah then blah else..." is there any way to do this? I'd prefer not to have to reload the page whenever its changed. If there isn't, just say, and i'll go suck a lemon...

Replies:

Posted By: Phat
Date Posted: 28 February 2005 at 1:08am

It sounds like you want to do something like http://www.otrader.com.au/portfolio-management-software/contact.asp
right click and view the source code to see what's going on.

It does not use the onChange event but you can modify it to do that.

Posted By: ub3rl337ch3ch
Date Posted: 28 February 2005 at 6:26pm

no, because that just uses onclick to change the visbility. It doesn't actually depend on the value of the radiobutton. what i need is something along the lines of (where field is a select box)

style="visibility:<%IF field = company THEN response.write "visible" else response.write "hidden"%>"

or at least to have the same effect. changing visibility depending on what has been clicked on is simple, especially since there's the behaviours wizard in frontpage does it for you. I need something that changes visibility depending on what option is selected in a combobox.

I know that i can do it by doing "onchange: submit" on the selectbox, and doing a postback, but i'd prefer not to reload the page.

Posted By: bootcom
Date Posted: 28 February 2005 at 7:08pm

Ah ok, I think I get you. Is this what your looking for ??

Basically it calls on a function using the onChange, and if the value is company it will hide that input, or if it is not company it will leave the display. You can modify this for your own needs.


<script language="javascript">
function changeVisibility(val){
// If the value of the drop down is company then go ahead and start clearing some of the form fields
if(val == "company"){
// clear the inputs you want
document.getElementById("input1").style.visibility = "hidden";
// or do it this way
document.getElementById("input1").style.display = "none"
return;
}
// If this does not have the value of company, keep the style
document.getElementById("input1").style.display = "";
return;
}
</script>
 
<select name="dropdown" onChange="changeVisibility(this.value)">
 <option value="company">company</option>
 <option value="house">house</option>
</select>

Posted By: ub3rl337ch3ch
Date Posted: 28 February 2005 at 8:07pm

how do i get that to make something else visible/hidden?

would it be:...?

document.getElementByID("corp").style.visibility = "hidden"

to make the object with id of corp hidden? or am i missing the point completely?

Posted By: bootcom
Date Posted: 28 February 2005 at 8:58pm

Yeah, thats it except its getElementById("corp") remembering javascript is case sensetive.

the visibility = "hidden" makes the element hidden from view.

the display = "none" makes the display = "none" basically shows how the page would look if that element were not there.

You haven't missed the point, if you give it a go you will see how it works,

Posted By: ub3rl337ch3ch
Date Posted: 02 March 2005 at 5:58pm

thanks, that was *exactly* what i was looking for. It worked a treat.

Posted By: zMaestro
Date Posted: 04 March 2005 at 3:16am

will this work on Netscape too, or only IE?

Posted By: bootcom
Date Posted: 04 March 2005 at 3:27am

This version is IE only (well the code that I dished out was) however here is a solution so that the document.getElementById works on browsers that don't support it

the solution

The following bit of script checks to see if document.all is present, but document.getElementById is not. If this is the case it then assigns a new function to document.getElementById that wraps around document.all

if(document.all && !document.getElementById) {
    document.getElementById = function(id) {
       return document.all[id];
    }
}

With this script present at the top of the head section, either in an external file or an inline script, all that is needed to reference an element on IE, Mozilla/NS6.x and a number of other browsers is document.getElementById('theID')

Hope that helps if your trying to make it netscape compatiable !!!