drop down hiding/showing selections

Hey Jason

Am trying to modify this to show different elements based on the drop down selection.

My drop down consists of 'Sponsors', 'Premium', 'Exhibitors' and 'Media'

SponsorsName is visible to all three

If you select 'Premium' the SponsorsLink input only (as well as SponsorsName)

If you select 'Sponsor' or 'Media' the SponsorsLink input and SponsorsImage upload should show (as well as SponsorsName)

I have tried playing around with the code that you showed me on this thread - http://www.webassist.com/forums/posts.php?id=35445 - but cant get it to work based on the above criteria.

so far I have

<script  type="text/javascript">
function setTextField() {
	var theList = document.getElementById("SponsorsType");
	var theText = document.getElementById("SponsorsLink");
	var theSelectedValue = theList.options[theList.selectedIndex].value;
	if((theSelectedValue == "Sponsor") || (theSelectedValue == "Premium") || (theSelectedValue == "Media")) {
		theText.style.display = "block";
	} else {
		theText.style.display = "none";
	}
}
</script>

which shows 2 fields, SponsorsName (by default) for all 4, but only the SponsorsLink for 'Sponsors', 'Premium' - whatever I have tried I cannot get it to work based on if Sponors is selected, then all three elements show.

Also, in the attached _update page, if I navigate to it and the entry is, for example either a premium or sponsor entry, then the hidden fields arent showing by default. You have to toggle them on by using the drop down.

As always, many thanks

Jamie

first off, change the IDs for the div around the link and image upload, you are using the same ID as the elements themselves. the following code is based on using the IDs "SponsorsLinkDIV" and "ImageUploadDIV"

next, you need to add a variable for the ImageUploadDIV and another if statement to show or hide it based not he select value. I'm not 100% I have your exact requirements right, but this should get you on the right foot:

<script  type="text/javascript">
function setTextField() {
	var theList = document.getElementById("SponsorsType");
	var theLinkDiv = document.getElementById("SponsorsLinkDIV");
	var theUploadDiv = document.getElementById("ImageUploadDIV");
	var theSelectedValue = theList.options[theList.selectedIndex].value;
	//Show the link?
	if((theSelectedValue == "Sponsor") || (theSelectedValue == "Premium") || (theSelectedValue == "Media")) {
		theLinkDiv.style.display = "block";
	} else {
		theLinkDiv.style.display = "none";
	}
	//Show the upload?
	if((theSelectedValue == "Sponsor") || (theSelectedValue == "Media")) {
		theUploadDiv.style.display = "block";
	} else {
		theUploadDiv.style.display = "none";
	}
}
</script>

Thats brilliant, thanks Jason

Not sure why this would be happening, but when you enter the _update page of an existing entry, the correct item is pre-selected in the drop down, but none of the hidden fields are shown until you select a different option in the drop down and then go back to the original item

Thanks

Jamie

call the setTextField() function just before the closing body tag:

<script type="text/javascript">
setTextField()
</script>

awesome thanks mate

Jamie

you're welcome.