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>
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());
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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With