0

Hello so here is what I am doing :

  $("#categorys").change(function () {
//$(document).on('click', '#categorys', function(){ 
        alert('changed or clicked');     
 });

when I use the .change nothing happens, no errors on the js debugger, when I use the on click event for the same dropdown it returns the alert. I would to be able to alert(this.val) once the dropdown value changes please help

cppit
  • 4,478
  • 11
  • 43
  • 68
  • Are you adding the `#categorys` element to the page dynamically? – Barmar Jan 29 '14 at 18:05
  • possible duplicate of [Event binding on dynamically created elements?](http://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements) – Barmar Jan 29 '14 at 18:07

2 Answers2

1

It's because you use event delegation for your click event, you need to do the same for change event:

$(document).on('change', '#categorys', function(){ 
    alert('changed or clicked');     
});

Btw, this behavior only happens when your select has been added dynamically.

Felix
  • 37,892
  • 8
  • 43
  • 55
0

I used this to solve the matter: 

$(document).on('change', '#categorys', function(){ 
        alert($(this).val());     


    });
cppit
  • 4,478
  • 11
  • 43
  • 68
  • If that solved your problem, then it's almost certainly due to the fact that `#categorys` was being added to the DOM after the event was bound. The original syntax was perfectly valid, but requires the element to exist at the time it is bound. By using the `on` syntax you are actually binding the event to the document, allowing it to catch events which bubble from dynamically added elements. – Owen Allen Jan 29 '14 at 18:08