help with jquery onchange event on dropdown menu

Question

I would like to be able to launch an alert message everytime the value of the dropdown is changed. I thought the code below should have worked but it is not for some unknow reason. Any ideas why?

Thanks.

<html>
<head>
<script type="text/javascript" src="lib/jquery.js"></script>
</head>
<body>

<script type="text/javascript">
    $("select").change(function(){
        alert(this.id);
    });
</script>


<select>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

</body>
</html>

fearofawhackplanet · Accepted Answer · 2011-05-22 21:49:26Z

13

The code is fine, you just aren't initialising it correctly.

Try....

$(document).ready(function() {
    $("select").change(function(){
        alert(this.id);
    });
});

see the documentation here.

Your function alerts the id of the select element (which you haven't assigned to anything anyway). I'm assuming you actually wanted to get the value from the dropdown? In which case you want:

alert($(this).val());

answered May 22, 2011 at 21:49

fearofawhackplanet

53.6k55 gold badges167 silver badges258 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Rob Cowie · Accepted Answer · 2011-05-22 21:45:20Z

3

Register the onchange handler once the DOM is ready on page load.

$(function() {

   $("select").change(function(event) {
        alert(this.id);
        // alert( $(this).attr('id') ); to get the id attr with jquery
    });

});

I would also suggest targeting the select element with an id. Your code will show an alert every time any select on the page is changed.

edited May 22, 2011 at 21:45

answered May 22, 2011 at 21:40

Rob Cowie

22.6k6 gold badges65 silver badges58 bronze badges

1 Comment

Rob Cowie Over a year ago

@Slaks: Ha, no problem. Not fussed who, just a bit baffled about why

Ankit Arjaria · Accepted Answer · 2013-12-25 05:45:36Z

0

$(document).ready(function(){
$("#projectsName").change(function(){
       alert("HI");
});

});

Please Note that projectName is the id of dropdown and there is no other id with the same name other wise jquery will not work also double check your jquery plugin

answered Dec 25, 2013 at 5:45

Ankit Arjaria

1111 silver badge7 bronze badges

Collectives™ on Stack Overflow

help with jquery onchange event on dropdown menu

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related