This is my drop down menu ---
<select name="category" id="category" onChange="showDiv(this.value);" >
<option value="">Select This</option>
<option value="1">Nokia</option>
<option value="2">Samsung</option>
<option value="3">BlackBerry</option>
<option value="4">Spice</option>
<option value="5">HTC</option>
</select>
This is my span class where i want to show the data on the basis of selection
<span class="catlink"> </span>
My JS Function (although the function is working fine when i am doing it through if
conditions)
function showDiv(discselect) {
switch(discselect) {
case 1:
document.getElementsByClassName("catlink")[0].innerHTML = '<a href="nokia.txt">Click To Download</a>';
break;
case 2:
document.getElementsByClassName("catlink")[0].innerHTML = '<a href="samsung.txt">Click To Download</a>';
break;
case 3:
document.getElementsByClassName("catlink")[0].innerHTML = '<a href="blackberry.txt">Click To Download</a>';
break;
default:
alert(discselect);
document.getElementsByClassName("catlink")[0].innerHTML = 'aaaa';
}
}
Now on running the code each time the default case gets executed whereas 1,2,3 is still alerting, let me know what i am doing wrong and whr my logic lags??
This is my drop down menu ---
<select name="category" id="category" onChange="showDiv(this.value);" >
<option value="">Select This</option>
<option value="1">Nokia</option>
<option value="2">Samsung</option>
<option value="3">BlackBerry</option>
<option value="4">Spice</option>
<option value="5">HTC</option>
</select>
This is my span class where i want to show the data on the basis of selection
<span class="catlink"> </span>
My JS Function (although the function is working fine when i am doing it through if
conditions)
function showDiv(discselect) {
switch(discselect) {
case 1:
document.getElementsByClassName("catlink")[0].innerHTML = '<a href="nokia.txt">Click To Download</a>';
break;
case 2:
document.getElementsByClassName("catlink")[0].innerHTML = '<a href="samsung.txt">Click To Download</a>';
break;
case 3:
document.getElementsByClassName("catlink")[0].innerHTML = '<a href="blackberry.txt">Click To Download</a>';
break;
default:
alert(discselect);
document.getElementsByClassName("catlink")[0].innerHTML = 'aaaa';
}
}
Now on running the code each time the default case gets executed whereas 1,2,3 is still alerting, let me know what i am doing wrong and whr my logic lags??
Share Improve this question edited Jun 1, 2012 at 9:52 ThiefMaster 319k85 gold badges605 silver badges645 bronze badges asked Jun 1, 2012 at 9:48 swapneshswapnesh 26.7k24 gold badges97 silver badges129 bronze badges 2-
please don't repeat yourself ! Just evaluate
document.getElementsByClassName('catlink')[0]
once – Alnitak Commented Jun 1, 2012 at 9:56 -
1
switch...case
uses strict parison; you're paring a string to an integer. – Blazemonger Commented May 29, 2013 at 13:29
3 Answers
Reset to default 5Your discselect is ing across as a string..so you need to change your case to:
switch ( discselect ){
case '1':
break;
case '2':
break;
case '3':
break;
default:
alert(discselect);
}
}
Javascript's case
tests are strict: if discselect
is a string and not a number, your code will always take the default branch.
You can convert discselect
to a number in your switch
statement:
switch (+discselect) {
// ...
}
Or use strings in your case
tests:
switch (discselect) {
case "1":
// ...
break;
// ...
}
onChange="showDiv(this.value);"
should be
onchange="showDiv(this.options[this.selectedIndex].value)"
EDIT: and
switch (discselect) {
should be
switch (+discselect) {