?
Solved

How do I add in an onChange event to a dropDownList or Select List?

Posted on 2011-09-09
5
Medium Priority
?
335 Views
Last Modified: 2012-05-12
What sample code can you give me that adds an onChange event to a form created
with PHP controls. There should be a way to add the onChange event and idealy call back to PHP or javascript.
At the HTML level I could use Javascript but only after updating the HTML generated by:
CHtml::dropDownList

I have code that comes close but there is no targeting of select controls it works on all select controls.
Here are some things I have tried.
I have tried writing Javascript code right out oreilly's Javascript book but when applied to
<select id="myCB1" > ...</SELECT>   they don't work
namely using
<script>v
var b=document.getEleimentById("myCB1")  
b.attachEvent("onChange,myfunc); or b.addEventListener("Change",myfunc)

See the code that kind of works that uses JQuery below, however, it does not solve my problem of  a targeted solution for just myCB1 select box or dropdown list
When I have many dropdownlists or as they become in HTML  SELECT controls:

 

 
!DOCTYPE html> 
<html> 
<head> 
  <style> 
 
  div { color:red; } 
  </style> 
  <script src="http://code.jquery.com/jquery-latest.js"></script> 
</head> 
<body> 
  <select name="sweets" > 
    <option>Chocolate</option> 
    <option selected="selected">Candy</option> 
 
    <option>Taffy</option> 
    <option>Caramel</option> 
    <option>Fudge</option> 
    <option>Cookie</option> 
 
  </select> 
  <div></div> 
<script> 
    $("select").change(function () { 
          var str = ""; 
          $("select option:selected").each(function () { 
                str += $(this).text() + " "; 
              }); 
          $("div").text(str); 
        }) 
        .change(); 
</script> 
 
</body> 
</html>

Open in new window

0
Comment
Question by:Robert Silver
[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
  • 4
5 Comments
 
LVL 82

Accepted Solution

by:
leakim971 earned 1500 total points
ID: 36511046
use class, and id or a nam attribute
for example you set the name attribute of your select : sweets
you may use :

    $("select[name='sweets']").change(function () {
0
 
LVL 82

Expert Comment

by:leakim971
ID: 36511101
0
 
LVL 2

Author Closing Comment

by:Robert Silver
ID: 36511601
You did not not finish your work there. But Your answer was right on target:
Here is what you should have done:
The code works best with completeness. Makes everything crystal clear
Same HTML but the script should be:
<script>
  $("select[name='sweets']").change(function () {
          var str = "";
        $("select[name='sweets'] option:selected").each(function () {
                str += $(this).text() + " ";
              });
          $("div").text(str);
        })
        .change();
</script>
0
 
LVL 82

Expert Comment

by:leakim971
ID: 36511628
my work? lol
0
 
LVL 82

Expert Comment

by:leakim971
ID: 36511642
and you did not check the link provided, same as your final solution (with a tip)

so at the end : Thanks for the B grade!!!
0

Featured Post

On Demand Webinar: Networking for the Cloud Era

Did you know SD-WANs can improve network connectivity? Check out this webinar to learn how an SD-WAN simplified, one-click tool can help you migrate and manage data in the cloud.

Question has a verified solution.

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

Build an array called $myWeek which will hold the array elements Today, Yesterday and then builds up the rest of the week by the name of the day going back 1 week.   (CODE) (CODE) Then you just need to pass your date to the function. If i…
I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
Suggested Courses

762 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