Can't trigger change on option with CasperJS

Question

I have this html:

<select class="ik-target" name="make_id" id="the_maker_id" data-ik-class="maker-select">
 <option value="" class="empty-item">Choose maker</option>
 <optgroup label="Some of them">
  ...
 </optgroup>
 <optgroup label="Chosen">
    <option value="2" style="text-indent: 10px;">A</option>
    <option value="5" style="text-indent: 10px;">B</option>
    <option value="16" style="text-indent: 10px;">C</option>
    <option value="819" style="text-indent: 10px;">D</option>
 </optgroup>
</select>

I then try this (which usually works):

var thisnow = "5";
this.evaluate(function(valueOptionSelect){
   $('select#form_maker_id optgroup[label="Chosen"] option').val(valueOptionSelect);
   $('select#form_maker_id optgroup[label="Chosen"] option').trigger("change");
},thisnow);

But that does not change the option value from default value=""

Any ideas how I can fix it?

Answer 1

You should set value of select element and trigger change event on it too:

$('#form_maker_id').val(valueOptionSelect).change();