Question

I’m using TypeScript 0.8.2 and the latest JQuery 1.9 .d.ts definitions from https://github.com/borisyankov/DefinitelyTyped/tree/master/jquery

To isolate the problem, I have a simple TypeScript class definition that tries to make a single $.ajax call using the .when() and .then() syntax. Here’s my code:

/// <reference path="../../jquery.d.ts" />

module Demo {

    // Class
    export class TestDeferred {
        // Constructor
        constructor() {

            $.when(this.testAjaxCall()).then((data, status, jqXHR: JQueryXHR) => {
                alert(jqXHR.statusText);
            });

            $.when($.ajax("test.htm")).then(() => {
                console.log("yay");
            });
        }

        testAjaxCall() {
            return $.ajax("Test.aspx");
        }
    }
}

In both of these test cases, I get a compile time error that says:

Supplied parameters do not match any signature of call target and the red squiggly is on the first parameter of the .when() method. He’s a screenshot:

As far as I can tell, the .when() method in the .d.ts file has an overload of .when(options: any) and the .ajax is defined to be of type JQueryXHR which implements the JQueryPromise interface.

In theory this should work just fine as it mirrors the jQuery documentation for .when() http://api.jquery.com/jQuery.when/

$.when( $.ajax("test.aspx") ).then(function(data, textStatus, jqXHR){
     alert( jqXHR.status ); // alerts 200
});

So what am I missing? Did I define something wrong?

Answer 1

There may be a subtle error in the type file for jQuery. The following works:

$.when( $.ajax("test.aspx") ).then(function(data, textStatus, jqXHR){
     alert( jqXHR.status );
}, null);

This is because the type file expects you to pass both a success handler and a failure handler. I will check the documentation and update the definition to show that the failure handler is optional.

Update

I have submitted the following change to the jQuery type definition:

then(doneCallbacks: any, failCallbacks: any, progressCallbacks?: any): JQueryPromise;

Changed to

then(doneCallbacks: any, failCallbacks?: any, progressCallbacks?: any): JQueryPromise;