语法糖对原型的Ajax功能

Question

I would like to create syntactic sugar to Ajax.Response() .

Like this:

AjaxGet = function(url) {
  ar = new Ajax.Request(url,
       { onSuccess: function(transport) {
             alert(transport.responseText);
             return transport.responseText;
          }
       });
  return ar.responseText;
}

So that

title = AjaxGet('/favouriteMovie?horrors=true')

would store to title variable result of Ajax request. But the function code above is not working, not returning responseText

Answer 1

It is issue with the ajax call being asynchronous. easier fix would be to specify asynchronous: false in your Ajax.Get call. Eg:

AjaxGet = function(url) {
  ar = new Ajax.Request(url,
       { onSuccess: function(transport) {
             alert(transport.responseText);
             return transport.responseText;
          },
         asynchronous: false
       });
  return ar.responseText;
}

However I suggest to retain the async functionality of the requests and then tweak th on Success function callbacks as needed.

Answer 2

You can only do this if you use synchronous Ajax, which you should never ever do . The user interface of the whole browser will become unresponsive for the duration of the request, which you have no way to predict.

So the best you can do will involve a callback of some sort:

function AjaxGet(url, callback) {
  new Ajax.Request(url, {
    onSuccess: function(xhr){ callback(xhr.responseText) }
  });
}

There are problems with this approach, though:

1. It won't allow you to handle XML content types.
2. You won't be able to set custom headers.
3. You won't be able to handle any kind of errors.

For these reasons I recommend you go with the full Ajax.Request whenever you need it.