OnChange and Click simultaneously

Question

I have the following scenario:

Two 'Controls' like this:

<span class="search-select">
    <select id="Item_TBUID" name="ViewModel.SearchTbuid">
        <option value="" style="display: block;" selected="selected">ALL</option>
    </select>
    <input class="textfield" id="textfield_SearchTbuid" name="textfield.SearchTbuid" type="text" value="" />
</span>

The 'Control' is involved in a couple of events.

• input.textfield on focusout triggers the select's change event (via trigger).
• The select's change event triggers an ajax call to change the second Control's options (simply put, cascading dropdowns).

When I type something into the input (filtering the options of the first Control's select) and then immediately click on the second Control's dropdown (the one cascading) it partially loads the new data. It will fully load the new data (from ajax call) if I simply lose focus of the select and click it again.

I know the following isn't super useful code but I don't want to paste a bunch of code when 90% of it is irrelevant since I'm asking about events, their order, etc.

/* Applies the SearchSelect plugin to all controls 
 *  which filters the select's options and triggers the
 *  select's change event when the textfield loses focus.
 */
$(".search-select").SearchSelect();

/* Applies cascading event to the select element.
 * Which makes an ajax call for the new options.
 *  The success event of the ajax call then adds the options
 *      to the second control's select.
 */
cascade(RetailerCostZone);

Question: How can I tell the select's click event that displays the options to wait on the AJAX call to finish fully?