Как активировать определенную карту в Sencha Touch с другой карты с помощью onclick - PullRequest
Новая
       0

Как активировать определенную карту в Sencha Touch с другой карты с помощью onclick

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

У меня в приложении несколько разных карт, и я пытаюсь активировать одну из своих вспомогательных карт с экрана моей домашней страницы.

Вот соответствующая информация.

Настройка 

Ext.setup({
    id: 'Ext-setup',
    onReady: function () {
        rpc.main.init();
    }
});

Main 

rpc.main = {
    init: function () {
        var rootPanel = new Ext.TabPanel({
            id: 'rpc-rootPanel',
            fullscreen: true,
            layout: 'card',
            region: 'center',
            items: [
                rpc.controllers.HomeController,
                rpc.controllers.VimeoController,
            ]
        });
    }
};

HomeController 

rpc.controllers.HomeController = new Ext.Panel({
    id: 'rpc-controllers-homecontroller',
    layout: 'card',
    items: [rpc.views.Home.index],
    listeners: {
        activate: function () {
            if (rpc.stores.HomeStore.getCount() === 0) {
                // This store uses the rpc.templates.AboutDetails XTemplate
                rpc.stores.HomeStore.load();
            }
        }
    }
});

Home Index View 

rpc.views.Home.index = new Ext.DataView({
    id: 'rpc-views-home-index',
    itemSelector: 'div.home-index',
    tpl: rpc.templates.AboutDetails,
    store: rpc.stores.HomeStore,
    fullscreen: true,
});

Контроллер Vimeo 

rpc.controllers.VimeoController = new Ext.Panel({
    id: 'rpc-controllers-VimeoController',
    layout: 'card',
    fullscreen: true,
    items: [rpc.views.Vimeo.index,
            rpc.views.Vimeo.Details]
});

Vimeo Index View 

rpc.views.Vimeo.index = new Ext.Panel({
    id: 'rpc-views-Vimeo-index',
    layout: 'fit',
    dockedItems: [{xtype: 'toolbar', title: 'Videos'}]
    // stuff left out to keep it clean
});

Шаблон, который я использую, чтобы попытаться активировать карту Здесь вы увидите вызов javascript javascript:goToCard();

rpc.templates.AboutDetails = new Ext.XTemplate(
'   <tpl for=".">',
'      <div class="padded">',
'          <div class="rounded-div">',
'              <h1>RockPointe Church</h1>',
'              <span class="rpc-sub">One church meeting in multiple locations.</span>',
'          </div>',
'      <div>',
'      <div id="quick-nav">',
'          <ul>',
'               <li><span onclick="javascript:goToCard(\'rpc-controllers-VimeoController\',\'rpc-views-Vimeo-index\');">Videos</span></li>',
'               <li><span onclick="javascript:goToCard()">Events</span></li>',
'               <li><span onclick="javascript:goToCard()">Sites</span></li>',
'          </ul>',
'          <br clear="left">',
'      </div>',
'   </tpl>'

И наконец, метод goToCard(); 

function goToCard(panelId, cardId) {
    Ext.getCmp(panelId).setActiveItem(cardId);
}

Проблема проста ... ничего не происходит, когда я нажимаю на 

<span onclick="javascript:goToCard(\'rpc-controllers-VimeoController\',\'rpc-views-Vimeo-index\');">Videos</span>

Если я запускаю код непосредственно вмоя консоль 

Ext.getCmp('rpc-controllers-VimeoController').setActiveItem('rpc-views-Vimeo-index');

Я получаю следующий вывод.

подкласс
AdditionalCls: Array [0]
autoRender: true
body: El.Ext.Element.Ext.extend.constructor
cardSwitchAnimation: «слайд»
компонентtCls: "x-panel"
componentLayout: подкласс
контейнер: El.Ext.Element.Ext.extend.constructor
dockedItems: Ext.util.MixedCollection
el: El.Ext.Element.Ext.extend.constructor
события: объект
полный экран: true
getTargetEl: function () {
высота: 306
hidden: true
hiddenOwnerCt: false
iconCls: "tv "
id:" rpc-controllers-VimeoController "
initialConfig: Object
items: Ext.util.MixedCollection
макет: подкласс
layoutOnShow: Ext.util.MixedCollection
monitorOrientation: true
mons: Array [0]
needsLayout: false
originalGetTargetEl: function () {
ownerCt: подкласс
renderData: Object
renderSelectors: Object
renderTo: null
отображается: true
scroll: "вертикальный"
scrollEl: El.Ext.Element.Ext.extend.constructor
scroller: Ext.util.Scroller.Ext.extend.constructor
вкладка: подкласс
название: "Видео"
ширина: 798
proto : F

Но на самом деле ничего не происходит: - (
В принципе, я не получаю сообщение об ошибке и не загружается соответствующий просмотр.

Я также пытался
Ext.getCmp('rpc-controllers-VimeoController').layout.setActiveItem('rpc-views-Vimeo-index');

Но ответ был еще меньше ...

Неверно

Если я просто запустил
Ext.getCmp('rpc-controllers-VimeoController');
Я смогу увидеть 'rpc-views-Vimeo-index' ID в массиве элементов.

1 Ответ

2 голосов
/ 14 августа 2011

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

Все это в сторону - причина, по которой вы ничего не видите, заключается в том, что пока вы устанавливаете активный элемент на 'rpc-controllers-VimeoController 'панель, вы никогда не скажете ей изменить активный элемент отображаемой панели - который, судя по вашему вложенному безумию, называется' rpc-rootPanel '.Поэтому вам нужно установить активный элемент 'rpc-rootPanel' на свой 'rpc-controllers-VimeoController', а затем установить активный элемент 'rpc-controllers-VimeoController' на rpc-views-Vimeo-index./ facepalm

Несмотря на плохие методы проектирования, чтобы ответить на ваш вопрос, вы, скорее всего, просто сделаете это: 

 function goToCard(panelId, cardId) {
   Ext.getCmp('rpc-rootPanel').setActiveItem(1);
   Ext.getCmp(panelId).setActiveItem(cardId);
 }

Вам понадобится несколько if-then, чтобы проверить, какой PanelIdВаша ссылка для и установите активный элемент корневой панели соответственно.Вышеуказанное относится именно к вашей ссылке ...

...