Проблема с Sencha Touch MVC - PullRequest
       0

Проблема с Sencha Touch MVC

1 голос
/ 07 августа 2011

Я пытаюсь научиться использовать Sencha Touch для создания веб-приложений.Я следовал за уроком Здесь , и я немного застрял.Ниже были созданы один контроллер, два вида и модель (весь другой код скопирован и вставлен из учебника).По первому мнению, Index прекрасно работает.Однако, если я пытаюсь получить доступ ко второму, он открывает пустую страницу, ни одна из кнопок панели инструментов не работает, и он не запускает предупреждение.

Если я закомментирую строку this.application.viewport.setActiveItem(this.editGyms);, предупреждениебудет запускаться, но, очевидно, он не отображает страницу.

Я просмотрел несколько других учебных пособий, и они, похоже, также используют элемент setActiveItem для переключения представлений.что-то, или я должен как-то деактивировать первый вид, чтобы активировать второй или что-то?

HomeController.js

Ext.regController('Home', {

//Index
index: function()
{
    if ( ! this.indexView)
    {
        this.indexView = this.render({
            xtype: 'HomeIndex',
        });
    }
    this.application.viewport.setActiveItem(this.indexView);
},
editGyms: function()
{
    if ( ! this.editGyms)
    {
        this.editGyms = this.render({
            xtype: 'EditGymStore',
        });
    }
    this.application.viewport.setActiveItem(this.editGyms);
    Ext.Msg.alert('Test', "Edit's index action was called!");
},
});

views / home / HomeIndexView.js

App.views.wodList = new Ext.List({
    id:      'WODList',
    store:   'WODStore',
disableSelection: true,
fullscreen: true,
itemTpl: '<div class="list-item-title"><b>{title}</b></div>' +  '<div class="list-item-narrative">{wod}</div>'
});

App.views.HomeIndex = Ext.extend(Ext.Panel, {
items: [App.views.wodList]  
});
Ext.reg('HomeIndex', App.views.HomeIndex);

views / home / EditGymStore.js

App.views.EditGymStore = Ext.extend(Ext.Panel, {
html: 'Edit Gyms Displayed Here',

});
Ext.reg('EditGymStore', App.views.EditGymStore);

models / appModel.js

Ext.regModel('WOD', {
idProperty: 'id',
fields: [
    { name: 'id', type: 'int' },
    { name: 'date', type: 'date', dateFormat: 'c' },
    { name: 'title', type: 'string' },
    { name: 'wod', type: 'string' },
    { name: 'url', type: 'string' }
],
validations: [
    { type: 'presence', field: 'id' },
    { type: 'presence', field: 'title' }
]
});

Ext.regStore('WODStore', {
model: 'WOD',
sorters: [{
    property: 'id',
    direction: 'DESC'
}],
proxy: {
    type: 'localstorage',
    id: 'wod-app-localstore'
},
// REMOVE AFTER TESTING!!
data: [
{ id: 1, date: new Date(), title: '110806 - Title1', wod: '<br/><br/>Desc1</br><br/>' },
{ id: 1, date: new Date(), title: '110806 - Title1', wod: '<br/><br/>Desc2</br><br/>' }
]
});

viewport.js с панелью инструментов

App.views.viewport = Ext.extend(Ext.Panel, {
fullscreen: true,
layout: 'card',
cardSwitchAnimation: 'slide',
scroll: 'vertical',
styleHtmlContent: true,
style: 'background: #d8e2ef',
dockedItems: [
    {
        xtype: 'toolbar',
        title: 'The Daily WOD',
        buttonAlign: 'right',
        items: [
        {
            id:     'loginButton',
            text:   'Login',
            ui:     'action',
            handler: function() {
                Ext.Msg.alert('Login', "This will allow you to Login!");
            }
        },
        {
            xtype:  'spacer'
        },
        {
            xtype:  'button',
            iconMask: true,
            iconCls:  'refresh',
            ui:     'action',
            handler: function() {
                Ext.Msg.alert('Refresh', "Refresh!");

            }
        }]
    },
],
});

Спасибо запомогите !!

Ответы [ 2 ]

0 голосов
/ 08 августа 2011

В HomeController.js ваша функция действия (editGyms) - это то же имя, что и переменная, которую вы используете для своего представления (this.editGyms), поэтому, когда она пытается setActiveItem(this.editGyms), она фактически передает функцию действия контроллеров, а нечем результаты this.render({...})

Либо измените имя действия контроллера, либо измените имя переменной, которую вы используете для хранения представления .. как

editGyms: function() {
  if ( ! this.editGymView) {
    this.editGymView = this.render({
      xtype: 'EditGymStore',
    });
  }
this.application.viewport.setActiveItem(this.editGymView);
Ext.Msg.alert('Test', "Edit's index action was called!");
}
0 голосов
/ 08 августа 2011

Я - коллега с парнем, который написал учебник, на который вы ссылаетесь.Вы должны добавить комментарий к этому сообщению, потому что я описал ему вашу проблему, и он сказал, что знает решение.

Вы можете просто добавить ссылку на эту страницу, чтобы вам не пришлось снова все описывать.

Также он (очень) скоро опубликует 3-ю часть этого урока, в которой будут освещены некоторые похожие вещи.

...