Backbone.js model fetch: parameters cause success/error/completed callbacks not to trigger

Question

If I put the parameters in, I get no success/error/completed callbacks, but Fiddler shows a 200 response and my requested json data is there. That's the key. Fiddler is showing the round trip was a success and the requested data is here client side and in good order. Problem is backbone success/failure/completed not called. Just get a big nothing.

With the exact same base URL, if I take the parameters out (and remove them from my web service in parallel), both success and completed are triggered. Below is my fetch "with" parameters:

myModel.fetch({
    data: {
        name: 'Bob',
        userid: '1',
        usertype: 'new'
    }
}, {
    success: (function () {
        alert(' Service request success: ');
    }),
    error: (function (e) {
        alert(' Service request failure: ' + e);
    }),
    complete: (function (e) {
        alert(' Service request completed ');
    })
});

How can the backbone behavior be different? It's the same URL, just with or without parameters.

I'm guessing the distinction is that under the hood in the backbone fetch, the "with" parameters scenario is a post and the "without" parameters is a simple get. The IE console reflects this with slightly different output.

"With" parameters my IE browser console reports a warning (not an error but a warning) that the request required CORS:

!SEC7118: XMLHttpRequest for http://example.com/service/myservice.asmx/myoperation?name=Bob&userid=1&usertype=new required Cross Origin Resource Sharing (CORS).

I think it's just telling me "hey, you made a cross origin request and I let it through". "Without" the parameters I don't get that warning. I do have the service headers set to:

Access-Control-Allow-Origin: *

And the responses do indeed come back reflecting that policy.

So the question is why don't the backbone success/error/completed callbacks trigger "with" the parameters? The data makes it back. Shouldn't backbone reflect success?

Answer 1

Put your success, error, and complete methods in the same object you have data. There should only be the single object. Under the hood Backbone simply uses jQuery's ajax() method so the object you pass to fetch() can use any property that could be included in the settings object passed to $.ajax().

myModel.fetch({
    data: {
        name: 'Bob',
        userid: '1',
        usertype: 'new'
    },
    success: (function () {
        alert(' Service request success: ');
    }),
    error: (function (e) {
        alert(' Service request failure: ' + e);
    }),
    complete: (function (e) {
        alert(' Service request completed ');
    })
});