I am trying to build a simple form that has one text field, with an #autocomplete_path so it basically acts like a node reference field, and a select field with options that change based on the node that is selected in first field. My fields are like this:

  $form['place_nid'] = array(
    '#type' => 'textfield', 
    '#title' => t('Place'),
    '#autocomplete_path' => 'admin/place_autocomplete',     
    '#size' => 30, 
    '#weight' => -1,
  );

  $form['book_nid'] = array(
    '#type' => 'select',
    '#title' => t('Book Source'),
    '#options' => array('' => ' - All Books - '),
  );

My jQuery looks like this:

$(document).ready(function(){  
$("input#edit-place-nid").change(function() {
    $.getJSON("/admin/book_ajax",{section_id: $("input#edit-place-nid").val()}, function(j){
      var options = $.map(j, function(item) {
        $(document.createElement('option')).val(item.optValue).html(item.optDiaply);
      })
      $('select#edit-book-nid').empty().append(options);
    })       
  })
})

There appears to be some sort of gotcha going on here with my JQuery, and whatever js/jQ is running for the #autocomplete_path. With FireBug I can see that if I type some text into my place_nid field and then quickly click somewhere else (before that ajax call is complete), the change function is fired and my book_ajax is called. However, if i type some text into place_nid and wait for the #autocomplete_path ajax to finish and then click elsewhere, the change event is never fired and my book_ajax is never called.

Can anyone help with this problem? I am stumped.