Относительно архитектуры ExtJs4 MVC - PullRequest
Новая
       8

Относительно архитектуры ExtJs4 MVC

0 голосов
/ 04 ноября 2011

У меня определены следующие виды:

LeftNavigation (Панель сетки) 

Ext.define('Ray.view.StationsList', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.LeftNavigation',

    store: 'LeftNavigation',
    title: 'Navigation',
    hideHeaders: true,

    initComponent: function () {
        this.columns = [{
            dataIndex: 'name',
            flex: 1
        }];

        this.callParent();
    }
});

Содержание (Панель) 

Ext.define('Ray.view.Contents', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.Contents'
});

Формы (Панель форм) 

Ext.define('Ray.view.Form', {
    extend: 'Ext.form.Panel',
    alias: 'widget.Claim',

    title: 'ClaimForm',

    initComponent: function () {
        this.items = [{
            xtype: 'form',
            items: [{
                xtype: 'textfield',
                name: 'name',
                fieldLabel: 'Name'
            }, {
                xtype: 'textfield',
                name: 'email',
                fieldLabel: 'Email'
            }]
        }];

        this.buttons = [{
            text: 'Save',
            action: 'save'
        }];

        this.callParent(arguments);
    }

});

Я пытаюсь использовать панель сетки в качестве навигации, данные для нее будут получены из файла json, который будет иметьполя 'id' и 'name'.где идентификатор будет служить идентификатором ссылки, а имя - текстом, который будет отображаться для ссылки.

«Содержание» будет основной областью, где отображаются все данные.В этом случае у меня есть несколько форм, которые мне нужно отобразить здесь.так что я пытаюсь добиться здесь, когда пользователь нажимает на конкретную ссылку в сетке навигации, мне нужно загрузить форму, которая соответствует «id» этой ссылки, в область «Содержание».

я пытаюсь выяснить, как нужно определить контроллер или контроллеры для достижения этой цели?

спасибо большое, соответствующий ответ был бы очень признателен.

Ответы [ 2 ]

2 голосов
/ 04 ноября 2011

Похоже, вам нужно создать прослушиватель для события itemclick сетки, чтобы определить, какую форму вы хотите загрузить.

Существует множество способов доступа к объектам в ExtJS, поэтому следуйте моим примерам кодавам нужно будет присвоить id или itemId каждому из ваших компонентов.Кроме того, я понятия не имею, как структурированы ваши файлы, поэтому вам может потребоваться изменить это, чтобы заставить его работать.Однако он должен обеспечить основу для работы вашего контроллера. 

Ext.define('Ray.controller.Stations', {
    extend: 'Ext.app.Controller',
    views: ['LeftNavigation', 'Contents', 'Claim'],
    init: function() {
        this.control({
            '#leftNavigationGrid': {
                itemclick: this.onItemClick
            }
        });
    },
    onItemClick: function(grid, record) {
        var id = record.data.id;
        var myForm = Ext.widget('Claim', { width: 400; height: 600; });

        Ext.ComponentQuery().query('#Contents')[0].add(myForm);
    }
});

Причина [0] после Ext.ComponentQuery().query() заключается в том, что массив всегда возвращается.Поскольку мы точно знаем, что мы (вероятно) получаем, это один объект с id или itemId, мы можем просто сказать, что хотим получить первый объект в возвращаемом массиве.

Это действительно принесет пользупрочитать весь учебник MVC, который упоминает JordbaerHjelmen, возможно, начиная с part 1 .

2 голосов
/ 04 ноября 2011

Я так же быстро изучаю это: вы посмотрели два урока по шаблону MVC?

Часть 3 из 4-х частей руководства MVC:

http://www.sencha.com/learn/architecting-your-app-in-ext-js-4-part-3/

И "автономный" учебник:

http://www.sencha.com/learn/the-mvc-application-architecture/

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

Лучшее

Andreas

...