Пример XUI Ajax - PullRequest
Новая
       20

Пример XUI Ajax

1 голос
/ 07 ноября 2011

Я не понимаю, как использовать вызов XUI xhr (ajax). Рассмотрим следующий код: 

x$('#left-panel').xhr('/panel', {
    async: true,
    callback: function() {
        alert("The response is " + this.responseText);
    },
   headers:{
       'Mobile':'true'
   }
});

Значит ли это, что когда пользователь НАЖИМАЕТ над левой панелью, xui сделает ajax-вызов для URL /panel и выдаст оповещение об успешном завершении? Но что, если я хочу, чтобы вызов ajax выполнялся вместо ONBLUR?

1 Ответ

4 голосов
/ 30 ноября 2011

API xui.js заявляют, что запрос xhr ...

... всегда вызывается в коллекции элементов и использует поведение html.

Итак, в вашем GET-запросе к /panel текст ответа будет отображаться в окне предупреждения, потому что это то, что говорит ваш обратный вызов.Однако без обратного вызова он загрузит ответ в элемент #left-panel, как если бы вы использовали: 

x$('#left-panel').xhr('/panel', {
   async: true,
   callback: function() {
       x$('#left-panel').html(this.responseText);
   },
   headers:{
       'Mobile':'true'
   }
});

То есть приведенный выше код должен производить такой же эффект, как: 

x$('#left-panel').xhr('/panel', {
   async: true,
   headers:{
       'Mobile':'true'
   }
});

Кроме того, вызов запроса xhr не зависит от события целевого элемента.То есть, это не обязательно вызвано парением (или размытием).Допустим, вы хотите привязать к нажатию элемента #left-panel.Тогда вам нужно что-то вроде: 

x$('#left-panel').on('click', function(e){
    this.xhr('/panel', {
       async: true,
       callback: function() {
           alert("The response is " + this.responseText);
       },
       headers:{
           'Mobile':'true'
       }
    });
});
...