jQuery триггерное изменение с прикованным ajax select

Question

Я использую chanied select таким образом и работает очень хорошо.

$(function() { 

    /** 
    * Chained Select (id_foo) 
    * 
    * @method on change 
    */ 
    $('select[name="id_foo"]').on('change', function() { 
     var id_foo = $("option:selected", this).prop("value"); 
     $.ajax({ 
      type : "POST", 
      url  : ajax.php, 
      data : { id_foo: id_foo }, 
      success : function(data) { 
       $('select[name="id_bar"]').html(data); 
      } 
     }); 
    }); 

}); /* END */ 

HTML

<select name="id_foo"> 
    <option value="1">one</option> 
    <option value="2">two</option> 
</select> 
<br> 
<select name="id_bar"> 
</select> 

ajax.php

if(isset($_POST['id_foo'])){ 
    $obj->selectBar($_POST['id_foo']); 
} 

Теперь я хотел бы использовать функцию триггера для имитации на событие изменения таким образом

$(function() { 

    $('select[name="id_foo"]').val('2').trigger('change'); 

    /** 
    * Chained Select (id_foo) 
    * 
    * @method on change 
    */ 
    $('select[name="id_foo"]').on('change', function() { 
    ... 
    ... 

Но без успеха. Значение select равно 2, но событие триггера ничего не делает. Как я могу решить? спасибо

Answer 1

val() не возвращает объект jQuery.

Вместо делать

$(function() { 
    var $sel = $('select[name="id_foo"]'); 
    $sel.on('change', function() { 
    var id_foo = this.value; 
    $.ajax({ 
     type : "POST", 
     url  : ajax.php, 
     data : { id_foo: id_foo }, 
     success : function(data) { 
      $('select[name="id_bar"]').html(data); 
     } 
    }); 
    }); 
    $sel.val('2'); 
    $sel.change(); 
});