/    Sign up×
Community /Pin to ProfileBookmark

dropdown menu is selected a group of forms will appear

When a certain dropdown menu is selected a group of forms will appear and then if you select another option that group of form will collapse or hide and another group of form will appear. How to do this?

Please kindly point me to a tutorial on how to accomplish this. I tried to search google but cant find the exact answer that Im looking for.

Thanks

to post a comment
JavaScript

5 Comments(s)

Copy linkTweet thisAlerts:
@kromolJun 17.2012 — You can hide one group of forms and show another when some menu item is selected.

If you use <select> for your menu just handle [B]onchange[/B] event for that purpose.
Copy linkTweet thisAlerts:
@mason66authorJun 17.2012 — Hi thanks for the reply. Can you please give me a code sample to reverse engineer?

Thanks!
Copy linkTweet thisAlerts:
@nap0leonJun 17.2012 — On my Coding Tips page, I have a few examples of using Hide/Show.

http://www.jasondahlin.com/2011/coding-tips/

Most of the examples show only hiding or showing one DIV at a time, you can easily hide/dhow more than one item at a time by calling the 'hide/show' function multiple times (for each item you want to hide or show). Typically, I would place this in a JS "switch-case" statement. e.g.
<i>
</i>(before showing anything, hide everything), then

case:"ShowGroupA"
safeToggleFieldDisplay('A1','inline')
safeToggleFieldDisplay('A2','inline')
Copy linkTweet thisAlerts:
@mason66authorJun 17.2012 — On my Coding Tips page, I have a few examples of using Hide/Show.

http://www.jasondahlin.com/2011/coding-tips/

Most of the examples show only hiding or showing one DIV at a time, you can easily hide/dhow more than one item at a time by calling the 'hide/show' function multiple times (for each item you want to hide or show). Typically, I would place this in a JS "switch-case" statement. e.g.
<i>
</i>(before showing anything, hide everything), then

case:"ShowGroupA"
safeToggleFieldDisplay('A1','inline')
safeToggleFieldDisplay('A2','inline')
[/QUOTE]


Hi Napoleon,

Great tutorials on your site! However I didnt see a dropdown list with onchange tutorial. Am i missing something?

Thanks
Copy linkTweet thisAlerts:
@nap0leonJun 17.2012 — I don't think I have one using a select box's onchange event. It would look like this:

&lt;select name="dropdown1" id="dropdown1" onchange="dropDown1Changed()"&gt;
&lt;option value="one"&gt;One&lt;/option&gt;
&lt;option value="two"&gt;Two&lt;/option&gt;
&lt;/select&gt;


This will call the function "dropDown1Changed()" which can then do whatever you want to do (like, look up the value that the user selected and do whatever hide/show you want to happen).
×

Success!

Help @mason66 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.4,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...