Come usare q.js per catena il modello backbone?

Question

Ho quanto segue:

var q = new app.models.OverwriteLineItemsProcess();
q.set('id', $("#process_id").val());
q.saveSource($("#source_quote").val());
q.lockSource();

.

saveSource invia dati al back-end utilizzando Ajax.Così è lockSource.

Voglio eseguire in questo modo sequenziale: Savesource >> Locksource.

Come scrivo il Q.JS per farlo funzionare?

di q.js, intendo https://github.com/kriskowal/q

Aggiornamento: aggiunto Savesource e Locksource

saveSource: function (quotation_id) {;
        var type = "PUT";
        var verb = "Updated";
        var headers = {
             'X-HTTP-Method-Override': type
        };

        var url = app.base_url + "/overwrite_line_items/" + this.id;
        this.set('source_quote', quotation_id);
        var data = this.toFormData();
        var result = false;
        var currentModel = this;
        var settings = {
            headers: headers,
            type: type,
            url: url,
            data: data,
            success: function(json) {
                response = JSON && JSON.parse(json) || $.parseJSON(json);
                console.log(response);
                currentModel.lockSource();
                $("#facebox-source-quote-status").html('<font color="green">SELECTED</font>');
            },
            error: function(response) {
                $("#facebox-source-quote-status").html('<font color="red">UNABLE TO SELECT</font>');
            },
            dataType: 'json'
        };
        $.ajax(settings).done(function() {
        });
    },

    lockSource: function () {
        var type = "PUT";
        var verb = "Updated";
        var headers = {
             'X-HTTP-Method-Override': type
        };

        var url = app.base_url + "/quotations/is_editable/" + this.attributes.source_quote;

        var data = this.toFormData();
        var result = false;
        var currentModel = this;
        var settings = {
            headers: headers,
            type: type,
            url: url,
            data: data,
            success: function(response) {
                console.log(response);
            },
            error: function(response) {
                $("#facebox-source-quote-status").html('<font color="red">UNABLE TO SELECT</font>');
            },
            dataType: 'json'
        };
        $.ajax(settings).done(function() {
        });
    },

.

Answer 1

La funzione jQuery.ajax che stai usando già restituisce una promessa per il suo risultato.Hai solo bisogno di restituirlo dalle tue funzioni:

saveSource: function (quotation_id) {;
    …
    var settings = {
        headers: headers,
        type: type,
        dataType: 'json', // jQuery will automatically parse it for you
        url: url,
        data: data
    };
    return $.ajax(settings).done(function() {
//  ^^^^^^
        $("#facebox-source-quote-status").html('<font color="green">SELECTED</font>');
        // notice I did remove the currentModel.lockSource(); call from the callback
    }, function() {
        $("#facebox-source-quote-status").html('<font color="red">UNABLE TO SELECT</font>');
    });
},
lockSource: function () {
    …
    var settings = // analoguous, no callbacks here
    return $.ajax(settings).fail(function(response) {
        $("#facebox-source-quote-status").html('<font color="red">UNABLE TO SELECT</font>');
    });
}

.

Ora puoi portarli facilmente:

var q = new app.models.OverwriteLineItemsProcess();
q.set('id', $("#process_id").val());
q.saveSource($("#source_quote").val()).then(function(saveResponse) {
    console.log(saveResponse);
    return q.lockSource();
}).done(function(lockResponse) {
    console.log(lockResponse);
});

.

Non hai nemmeno bisogno di Q per quello.Se si desidera utilizzarlo, avvolgere le chiamate $.ajax() in un'invocazione Q(), come spiegato nel convertire jQuery promette a q sezione dei documenti .