jquery terminal: how to echo to terminal upon AJAX completion?

Question

jquery terminal should echo out to screen upon ajax GET completion. Currently, the terminal.echo wont fire inside a success callback

Tried setting CORS but still wont output. this is a client problem.

jQuery(function ($, undefined) {
    $('body').terminal({
        register: function (email, user, pw) {
            this.echo("register...")
            jQuery.ajax({
                url: "https://faf3fg.execute-api.us-west-2.amazonaws.com/api/register/" + email +
                    '/' + user + '/' + pw,
                crossDomain: true,
                success: function (result) {
                    this.echo(data);
                    console.log(data);
                },
                async: false
            });
        }
    },{
        greetings: 'say',
        name: 'sterm',
        height: $('body').height(),
        width: $('body').width(),
        prompt: 'sss> ',
        completion: true
    });
});

I expected it to return the response of the AJAX request at a later time but this seems to be unsupported.

Answer 1

The this keyword doesn't mean what you think it means here:

success: function (result) {
    this.echo(data);
    console.log(data);
}

This code is invoked long after the code in which is was being set, and this no longer refers to your terminal instance. It now refers to the jqXHR object (the internals of the AJAX request/response).

You can capture that instance in a variable, which would retain that reference for later. Something like this:

var terminal = this;
terminal.echo("register...");
jQuery.ajax({
    //...
    success: function (result) {
        terminal.echo(data);
         console.log(data);
    }
});

---

Side note: You should remove async:false from your code. Not only is it a famously bad idea, but it's actively being deprecated from browsers. I wouldn't be surprised if there are browsers in common use already which don't support it.

Keep your asynchronous code asynchronous.