0

Can anyone help?

I want to execute a function depending on what select dropdown is chosen. The select name is dynamic so I need it to happen in one function loop

For e.g. The following function works and returns the correct class but its not going to work for my purposes and I need to wrap some if statements around it.

<script type='text/javascript'>
function div_It(id){
	document.getElementById('div1').className="x" + id + "z";	
}
</script>

however if I choose another select dropdown it eliminates the previous dropdown choice from the div and replaces it with a new class already specified in the CSS.

What I would like to do is

<select name="**the name is dynamically got from database**" onChange="div_It(this.value);">

<script type='text/javascript'>
function div_It(id)
If select name="abc"

{

	document.getElementById('div1').className="x" + id + "z";	
}

If select name="def"

{

	document.getElementById('div2').className="x" + id + "z";	
}

If select name="ghi"

{

	document.getElementById('div3').className="x" + id + "z";	
}
</script>

<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>

Can anyone advise me how to add the if statements to the function so that all select dropdowns are catered for and the values are returned to the correct div?

2
Contributors
2
Replies
3
Views
7 Years
Discussion Span
Last Post by technopup
0

One way that I can think of is that instead of passing this.value in the onchange event of the select box you can pass the object this itself as follows,

<select name="**the name is dynamically got from database**" onChange="div_It(this);">

And than in the div_It() function you can use both the name and value to serve your purpose.

<script type='text/javascript'>
function div_It(id){
     if(id.name=="abc"){
 	document.getElementById('div1').className="x" + id.value + "z";	
     }
     else if(id.name=="def"){
 	document.getElementById('div2').className="x" + id.value + "z";	
     }
     else if(id.name=="ghi"){
 	document.getElementById('div3').className="x" + id.value + "z";	
     }
}
</script>

Though this is not a perfect solution hope it gives you some starting pointers towards solution.

0

You are a genius! Thank you so very much, this is a perfect solution.

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.