Solved

Automatically check box when certain item is selected in a select drop down

Posted on 2015-02-06
3
95 Views
Last Modified: 2015-02-06
I have a SELECT and a CHECKBOX control on my form. When a certain option is selected (Volvo), I'd like the checkbox to automatically get checked. Can someone assist?

<select>
   <option value="volvo">Volvo</option>
   <option value="saab">Saab</option>
</select>
<INPUT TYPE=CHECKBOX NAME="volvo">Yes! Volvo was selected!<P>
0
Comment
Question by:earwig75
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
3 Comments
 
LVL 7

Accepted Solution

by:
Robert Sherman earned 500 total points
ID: 40594694
Quick and sloppy version:

<select id="ddlCar" onchange="var e = document.getElementById('ddlCar');var strUser = e.options[e.selectedIndex].text;var bool_volvo = (strUser == 'Volvo');document.getElementById('check_volvo').checked = bool_volvo;">
   <option value="volvo">Volvo</option>
   <option value="saab">Saab</option>
</select>
<INPUT TYPE=CHECKBOX NAME="volvo" id="check_volvo">Yes! Volvo was selected!<P> 
</body>
</html>

Open in new window

0
 
LVL 7

Expert Comment

by:Robert Sherman
ID: 40594719
Here's the same thing, with code separated out and a little easier to follow:

<script>
  function volvoCheck() {
  var e = document.getElementById('ddlCar');
  var strUser = e.options[e.selectedIndex].text;
  if (strUser == 'Volvo')  document.getElementById('check_volvo').checked = true;
}
</script>
<select id="ddlCar" onchange="volvoCheck();">
   <option value="">Please select:</option>
   <option value="volvo">Volvo</option>
   <option value="saab">Saab</option>
</select>
<INPUT TYPE=CHECKBOX NAME="volvo" id="check_volvo">Yes! Volvo was selected!<P> 
</body>
</html>

Open in new window

0
 

Author Closing Comment

by:earwig75
ID: 40594725
Thank you!
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
Find out what you should include to make the best professional email signature for your organization.
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: blockā€¦
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

729 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question