вернуть значение из ajax-запроса в другую функцию

Question

Я пытаюсь вернуть значение из (transport) в вызывающую функцию, но не могу заставить его работать:

function createXMLHttpRequest( w )
{
  var urly = '/users/notes/' + w;
  var options = {
      method:'get'
    , onSuccess: function( transport )
      {
        x = transport.responseText;
        return x;
      }
    , onFailure: function( transport )
      {
        var response = transport.responseText;
        alert( "FAILED "+ response );
      }
  };
  new Ajax.Request( urly, options );
  alert( x );
}

var ai = $( 'addItem' );
ai.onclick = function()
{
  // -1 indicates new
  addnote( -1, null );
}

x всегда оповещения не определены. Если я не назначу x на Ajax.Request, например x=new Ajax.Request(urly,options). Затем он предупредит [Object object]. Как я могу вернуть значение transport.responseText в функцию onclick?

Answer 1

Ваш запрос не asynchronous:false. Таким образом, x получает предупреждение до того, как запрос будет завершен, и x устанавливается на transport.responseText.

Вы должны либо установить запрос как синхронный, либо предупредить x в методе onSuccess.

Возвращаемое значение из onSuccess отбрасывается Ajax.Request. Ничего не возвращай.

Аякс по своей природе асинхронный. Вы должны запросить сервер, а затем обработать ответ в обратном вызове. Поэтому не следует пытаться использовать значение сервера в функции onclick, а следует использовать отдельный обратный вызов (метод onSuccess).

Answer 2

Это просто неправильно!

Когда вы делаете вызовы ajax, вы должны забыть думать синхронно, вместо этого думать асинхронно!Отправьте запрос на некоторый URL и отправьте функцию обратного вызова, которая будет выполнена, когда запрос вернет некоторые данные.

Я написал простую оболочку для вызовов GET

// AJAX WRAPPER
MYPROJECT = {};
MYPROJECT.Ajax = (function() {
    return{

        // get data by AJAX call and return as plain text
        get:function(url, callback) {
            new Ajax.Request(url, {
                method: 'get',
                onSuccess: function(transport) {
                    var data = transport.responseText.evalJSON();
                    callback(data);
                }
            });
        }
    }    
})();

// USAGE  
MYPROJECT.Ajax.get('/ajax_json_echo/?foo=bar',function(data){

    alert(data);
    $('containerText').innerHTML = data.get_response.foo
}); 

Вы можете увидеть код в действииздесь http://jsfiddle.net/wbDhY/1/

(наберитесь терпения, окно предупреждения должно появиться через 2 секунды)