JavaScript Fall Through Switch Statements

Posted At : March 17, 2010 6:17 PM | Posted By : Andy Sandefer
Related Categories: jQuery, jQuery UI, ColdFusion, JavaScript, AJAX

Someone recently asked me if it were possible to easily execute the same code for two or more possible case values in a JavaScript switch statement.

Quite simply, the answer is yes. In this example, I'm working with a form that's fairly multipurpose as in depending upon the user's selections we want to show and hide different divs as well as set some control values by default and possibly restrict use of other controls.

This is a CF app that makes use of jQuery for basic UI functionality. In this case (pun intended), I need to show/hide the same controls and divs for two options in a cfselect that I'm grabbing the value of in the top of my JavaScript function below...

view plain print about

1manageFormState = function(){
2        var routeStyle = ColdFusion.getElementValue('routeToID', 'outputEntry', 'value');
3        switch(routeStyle){
4            //Containerize Temp - Suspended Job goes to Work In Process
5            case '-1' :
6                $("#containerWorksheetA").show();
7                $("#containerWorksheetB").show();
8                $("#containerWorksheetC").show();
9                $("#containerWorksheetD").hide();
10                $("#containerWorksheetE").hide();
11                document.outputEntry.containerize.value = true;
12                document.outputEntry.statusCode.value = 14;
13                document.outputEntry.statusCode.disabled = true;
14            break;
15
16            //Containerize Final
17            case '-2' :
18                $("#containerWorksheetA").show();
19                $("#containerWorksheetB").show();
20                $("#containerWorksheetC").show();
21                $("#containerWorksheetD").hide();
22                $("#containerWorksheetE").hide();
23                document.outputEntry.containerize.value = true;
24                document.outputEntry.statusCode.value = 16;
25                document.outputEntry.statusCode.disabled = false;
26            break;
27
28            //Discard Material
29            case '-3' :
30                $("#containerWorksheetA").show();
31                $("#containerWorksheetB").show();
32                $("#containerWorksheetC").show();
33                $("#containerWorksheetD").hide();
34                $("#containerWorksheetE").hide();
35                document.outputEntry.containerize.value = true;
36                document.outputEntry.statusCode.value = 11;
37                document.outputEntry.statusCode.disabled = true;
38            break;
39
40            //this case is a fall through which handles init and separator values where controls are hidden
41            case '0' : case 'sep' :
42                $("#containerWorksheetA").hide();
43                $("#containerWorksheetB").hide();
44                $("#containerWorksheetC").hide();
45                $("#containerWorksheetD").hide();
46                $("#containerWorksheetE").hide();
47                document.outputEntry.statusCode.disabled = false;
48            break;
49
50            //this case applies to Step Driven Route scenarios
51            default :
52                $("#containerWorksheetA").show();
53                $("#containerWorksheetB").hide();
54                $("#containerWorksheetC").hide();
55                $("#containerWorksheetD").hide();
56                $("#containerWorksheetE").show();
57                document.outputEntry.statusCode.disabled = false;
58            break;
59        }
60    }

It's pretty easy but in case you didn't see it the fall through statement happens in the case of "case '0' : case 'sep' :". Just to play fair I will mention that some developers do not agree with this style of syntax but in my view as long as you're commenting each case then you're not leading anyone astray.

Comments (21) |

Print |

Send |

del.icio.us |

Digg It! |

Linking Blogs | 515 Views

Comments

[Add Comment] [Subscribe to Comments]

I am a beginner in programming with javascript and I am having a problem with shortening up this switch statement. I downloaded an mp3 interview with an experienced programmer on Music Search Engine http://www.mp3hunting.com and now I know that it is a way too important. I want the user to be able to type in an hour of the day from 1-24. when you type 5-11 script runs good morning, 12-18 script runs good afternoon, 19-24 and 1-4 script runs good evening. My code works but it is way too long. If anyone can give me a tip, I would really appreciate it. Thanks a lot.

# Posted By Hadley | 4/15/10 7:42 AM

@Hadley
You can use if statements to compare the selected option like...
if (selectedHour >= 1 && selectedHour <= 12){
alert('Good Morning');
}
or you can use a switch/case syntax.
Inside of your switch statement just do this...

case '1' : case '2' : case '3' //go all the way up to your max allowed...
alert('Good Morning');
break;

In my opinion the if statements will be cleaner to maintain and understand.

# Posted By Andy Sandefer | 4/15/10 12:32 PM

i hate javascript.debug...

# Posted By r4 ds | 4/23/10 6:29 AM

In my opinion the if statements will be cleaner to maintain and understand.

# Posted By labatterie | 4/26/10 4:05 AM

Thank you very much for your article. I can recommend you rapidshare search engine ( http://rapidqueen.com ), which personally I use for quite a long time.

# Posted By Paula | 6/9/10 10:39 AM

I really like your article, I support your point of view

# Posted By coach bags outlet | 6/18/10 5:41 AM

My code works but it is way too long. If anyone can give me a tip, I would really appreciate it.

# Posted By batterie | 6/24/10 2:34 AM

In my opinion the if statements will be cleaner to maintain and understand.
http://www.btscene.com

# Posted By Barron | 6/28/10 7:21 AM

Thanks for explaining. It is a nice scheme and easy way out.
http://eventsearch.us

# Posted By Stefani | 7/1/10 8:50 AM

thank you very much !!

# Posted By wholesale sunglasses | 7/1/10 11:57 AM

very informative posts and with great resource. Thanks for sharing

# Posted By 4Shared Mp3 Download | 7/9/10 6:32 AM

http://www.superpowerleveling.com http://www.wlkgame.com
http://www.wotlk-powerleveling.com http://www.uweddingdress.com wedding dresses

# Posted By rtrey | 7/15/10 6:42 AM

I found this is an informative and interesting post so i think so it is very useful and knowledgeable. I would like to thank you for the efforts you have made in writing this article. I am hoping the same best work from you in the future as well. In fact your creative writing ability has inspired me. Really the article is spreading its wings rapidly...
http://simulationassuranceauto.org

# Posted By simulation assurance auto | 7/19/10 9:56 PM

informative posts and with great resource……

# Posted By batterie | 7/20/10 8:43 AM

!!!!!!!!!!!!!!http://www.efox-shop.com/ !!!!!!!!!!!!
` ?—? ? ??`_?
????????????? ohne Vertrag,
????????????? Handy ohne Simlock?
??????????????Sciphones i68,
?????????????Touchscreen Handys und
????????????? Handy Zubeh?
????????????? re von Elektronik-
?——???????——?Grosshandel in
?????????? http://www.efox-shop.com/.
?????????? ??????
????????????????

# Posted By handychina | 7/22/10 1:01 AM

http://www.guccihandbagsoutlet.com/ gucci outlet
http://www.guccihandbagsoutlet.com/ gucci outlet online
http://www.guccihandbagsoutlet.com/ gucci handbags

# Posted By CoachHeels | 7/23/10 10:48 PM

http://www.coachoutletmalls.com/ Coach outlet
http://www.coachoutletmalls.com/ coach bags
http://www.coachoutletmalls.com/ coach bags outlet

# Posted By CoachHeels | 7/23/10 11:48 PM

http://www.cheap-mbt-shoes.net mbt shoes
http://www.cheap-mbt-shoes.net cheap mbt shoes
http://www.cheap-mbt-shoes.net walking shoes

http://www.monclerjacketsstore.com Moncler Store
http://www.monclerjacketsstore.com/Moncler-Down-Jackets.html" target="_blank">http://www.monclerjacketsstore.com/Moncler-Down-Ja... Moncler Down Jackets

# Posted By walking shoes | 7/26/10 6:57 AM

One way to buy [url=http://www.nfljerseys-shopping.com/]cheap jerseys[/url] is shopping online, [url=http://www.nfljerseys-shopping.com/]NFL jerseys[/url] at nfljerseys-shopping.com are sold at a discount, most of [url=http://www.nfljerseys-shopping.com/]football jerseys[/url] are having promotion. Why not action now?

# Posted By NFLjerseys | 7/27/10 12:14 AM

This post was very well written, and it also contains many useful facts. I appreciated your distinguished manner of writing the post. You have made it very easy for me to understand.
<a href=http://www.locations4business.com/europe/UK/nation... skill information</a>

# Posted By workforce skill information | 7/28/10 2:16 AM

You can find all these in our company:
all kinds of wedding dresses<a href=“http://www.sanseed.com”>weedding dresses</a>
all kinds of cosplay costumes
all kinds of creative gifts
all kinds of wigs and hairpieces
all kinds of holiday and party supplies
all kinds of electronics
Just believe in us and join.

http://www.sanseed.com/" target="_blank">http://www.sanseed.com/

# Posted By sanseed | 7/30/10 4:15 AM

[Add Comment]