JQuery Versprechen warten bis zum Ende

Ich erhalte vordefinierte Werte, die ich in zwei Auswahlen einfügen muss:

<div id="wrapper">
    <select id="first">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <select id="second"></select>
</div>

Optionen im Inneren#second hängt vom ausgewählten Wert in ab#first. Diese Optionen werden über Ajax geladen:

$('#first').change( function() {
        $.ajax({
            url: "giveMeValues.phpOrWhatever"
        }).done(function() {
            // just simulating data from ajax call
            $('#second').append(
                '<option value="a">a</option>'+
                '<option value="b">b</option>'+
                '<option value="c">c</option>'
            );
        });
    });

Das Problem ist, ich kann den Wert von einstellen#second nach dem Ajax-Daten werden geladen. Also wird folgender Code natürlich nicht funktionieren:

$('#first').val('2').change();
$('#second').val('b').change();

Also habe ich versucht zu verwenden.promise() warten, bis Ajax drinnen anruftchange Handler wird vervollständigt:

$('#first').val('2').change();
    $('#wrapper').promise().then( function() {
        $('#second').val('b');
        console.log('setting value...');
    });

Aber es geht nicht. Meine Frage ist: Wie kann ich warten, bis der Ajax-Anruf beendet ist, und dann einstellen#second Wert?

Hier hast du ein Problem:http://jsfiddle.net/W2nVd/

Vielen Dank für Ihre Zeit.

Antworten auf die Frage(3)

Ihre Antwort auf die Frage