Расширение объектов Sencha Touch - PullRequest
Новая
       0

Расширение объектов Sencha Touch

1 голос
/ 03 апреля 2011

Я пытаюсь расширить объект Ext.Container в рамках инфраструктуры Sencha Touch, чтобы добавить несколько необходимых мне свойств, одно из которых - загрузка файла через AJAX. 

App.Ext.AContainer = Ext.extend(Ext.Container, {
ajax : false,
doAjax : function(p, that) {
    Ext.Ajax.request({
        url : p,
        method : 'POST',
        success : function(result) {
            Ext.apply(that, {
                html : result.responseText
            })
        },
        failure : function(result) {
            Ext.Msg.alert('ERROR : AJAX : Could not load ' + p);
        }
    })
},
constructor : function(b) {

    if( b.ajax === true && b.hasOwnProperty('rhtml')) {
        this.doAjax(b.rhtml, this);
    }

    App.Ext.AContainer.superclass.constructor.call(this, b);

    console.log(this);

}
});

С фактической реализацией этого Контейнера: 

var servicesContainer = new App.Ext.AContainer({
  scroll : 'vertical',
  ajax : true,
  rhtml : 'test.html'
});

По сути, моя идея заключалась в том, чтобы создать метод, который позаботится о загрузке файла, а затем скопировать его в свойство html вручную. Когда я проверяю консоль на вывод «this», она показывает, что свойство html устанавливается с правильной разметкой, но не отображает разметку на странице.

Не совсем уверен, что я делаю не так.

Ответы [ 2 ]

0 голосов
/ 04 апреля 2011

Кроме того, нет необходимости передавать область видимости в doAjax, вместо этого: 

App.Ext.AContainer = Ext.extend(Ext.Container, {
    ajax: false,
    doAjax: function (p) {
        Ext.Ajax.request({
            url: p,
            method: 'POST',
            scope: this,
            success: function (result) {
                this.html = result.responseText;
            },
            failure: function (result) {
                Ext.Msg.alert('ERROR : AJAX : Could not load ' + p);
            }
        })
    },
    constructor: function (b) {

        if (b.ajax === true && b.hasOwnProperty('rhtml')) {
            this.doAjax(b.rhtml);
        }

        App.Ext.AContainer.superclass.constructor.call(this, b);

        console.log(this);

    }
});
0 голосов
/ 04 апреля 2011

Посмотрите на if внутри вашего конструктора. Он вызывает doAjax, что, в свою очередь, вызывает Ext.Ajax.request с функцией success в качестве аргумента. request документация по функциям гласит: 

Important: Ajax server requests are asynchronous, and this call will
     * return before the response has been received. Process any returned data
     * in a callback function.

Это означает, что поток управления мгновенно возвращается к вашему конструктору, прежде чем загрузка завершится (я думаю, даже до того, как запрос будет отправлен).

Итак, во время вызова console.log запрос (и функция success) еще не выполнены.

TL; DR : Переместите вызов console.log в функцию success.

...