title: Prgrammatic call to jquery .change() not firing event attached with bind change on hidden field
body: <p>I've been searching for possible clues for hours and have come up blank so I turn to you in your great wisdom to lend a hand...</p>
  
  <p>So I've got a form, and within that form there is a field I call a selection tool, made of two parts, a field to display a friendly label, and a hidden field to store the selected ID. It looks something like this:</p>
  
  <pre><code>&lt;input type="hidden" name="selector" id="selector" value="" /&gt;
  &lt;input type="text" readonly="readonly" id="selector_label" value="" /&gt;
  &lt;a.... link to selection tool .... /&gt;
  </code></pre>
  
  <p>The selection tool actually opens in a iframe which is important, but don't worry, there are no XSS errors.  Once the user clicks a record in the tool, that remote page calls the following:</p>
  
  <pre><code>$('#selector_label',window.parent.document).val(label);
  $('#selector',window.parent.document).val(selected).change();
  ...script to close iframe...
  </code></pre>
  
  <p>As you can see it's updating the form directly, and the second statement which updates the value of the hidden portion, finshes by calling <code>.change()</code> in order to trigger any listeners. Finally it closes the itself.</p>
  
  <p>To make this more complex, there is a listener assigned to the field like so:</p>
  
  <pre><code>$('#selector').on('blur change', function() {
      ... script to update a related field ...
  });
  </code></pre>
  
  <p>Pay no attention to the <code>blur</code> this is actually a dynamic script and assigned to a number of fields using <code>.each()</code> for different reasons. I'm including it just in case you're going to tell me it interferes somehow.</p>
  
  <p>So the selector tool works great, updates both the label and hidden fields, however the listener which I assigned dynamically isn't firing, so the related field isn't getting the value of the newly changed <code>#selector</code> field.</p>
  
  <p>Any ideas why my listener wouldn't be detecting the programmatically fired <code>.change()</code> event?  Thanks for any help you can offer!</p>
  
  <p>----- EDIT -----</p>
  
  <p>Updated as per suggestion in comments to use <code>.on()</code> instead of <code>.bind()</code>, unfortunately no change.</p>
  
  <p>Just FYI, I know this works with other fields, because there are <strong>others in the same form using this "relative" event to update and they work fine</strong>.  The important difference and possible cause is that <strong>they use visible and editable text fields rather than a hidden field</strong>.</p>
  
  <p>----- EDIT 2 -----</p>
  
  <p>For testing purposes, I changed the hidden field to a visible one, still with readonly, and initially it had no effect, selector still worked, but the assigned event did not.  However one interesting quirk is that if I click in that (previously hidden) field and then again somewhere else triggering the <code>blur</code> event state, the assigned event listener fires and updates the relative.  So why is the event fired only when I interact with the field and not when I programmatically tell it to fire the <code>.change()</code> event?</p>