JS Switch case not working correctly always default is executed

Question

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??

please _don't repeat yourself_ ! Just evaluate `document.getElementsByClassName('catlink')[0]` _once_ — Alnitak, Jun 01 '12 at 09:56
[`switch...case` uses strict comparison](http://stackoverflow.com/questions/6989902/is-it-safe-to-assume-strict-comparison-in-a-javascript-switch-statement?lq=1); you're comparing a string to an integer. — Blazemonger, May 29 '13 at 13:29

score 5 · Accepted Answer · answered Jun 01 '12 at 09:54

5

Your discselect is coming 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);
  }
}

answered Jun 01 '12 at 09:54

ltiong_sh

3,186
25
28

1

your shorter answer was better - no need to repeat the whole of the OP's code. – Alnitak Jun 01 '12 at 09:56

Frédéric Hamidi · Answer 2 · 2012-06-01T10:02:47.250

3

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;

    // ...
}

edited Jun 01 '12 at 10:02

answered Jun 01 '12 at 09:54

Frédéric Hamidi

258,201
41
486
479

1

+1, but FWIW I'd go for `case '1'` since the `+` operator on the first selection would yield `0` which may cause confusion. – Alnitak Jun 01 '12 at 09:58
@Alnitak, true, I updated my answer with the alternate solution. Thanks :) – Frédéric Hamidi Jun 01 '12 at 10:03

Luca Rainone · Answer 3 · 2012-06-01T10:01:57.803

0

onChange="showDiv(this.value);"

should be

onchange="showDiv(this.options[this.selectedIndex].value)"

EDIT: and

switch (discselect) {

should be

switch (+discselect) {

edited Jun 01 '12 at 10:01

answered Jun 01 '12 at 09:53

Luca Rainone

16,138
2
38
52

2

umm, no, they're (almost) equivalent. If anything the latter is more error prone because `selectedIndex` can be -1 – Alnitak Jun 01 '12 at 09:54
@Alnitak you're right. It solve nothing. but `switch(+discselect)` yes. I edit for complete answer (and +1ing to Frederic) – Luca Rainone Jun 01 '12 at 10:01

JS Switch case not working correctly always default is executed

3 Answers3

Linked