Проблема с ViewModule

Здравствуйте!
Нужна помощь в связывании View и ViewModule. Есть такой код

define('TestModule', ['ext-base', 'terrasoft', 'sandbox', 'Contact', 'TestModuleResources'],
        function (Ext, Terrasoft, sandbox, Contact, resources) {
            var viewModel = null;
            var renderContainer;

            var getView = function () {
                var container = Ext.create('Terrasoft.Container', {
                    id: 'container',
                    selectors: {
                        wrapEl: '#container'
                    },
                    items: [
                                        {
                                            className: 'Terrasoft.Container',
                                            id: 'header-name-container',
                                            classes: {
                                                wrapClassName: ['header-name-container']
                                            },
                                            selectors: {
                                                wrapEl: '#header-name-container'
                                            },
                                            items: [{
                                                className: 'Terrasoft.Label',
                                                id: 'header-name',
                                                caption: 'Main Caption',
                                                width: '100%'
                                            }]
                                        },
                                        {
                                            className: 'Terrasoft.Container',
                                            id: 'topButtons',
                                            selectors: {
                                                wrapEl: '#topButtons'
                                            },
                                            classes: {
                                                wrapClassName: ['container-spacing']
                                            },
                                            items: [
                                                        {
                                                            className: 'Terrasoft.Button',
                                                            id: 'btnAddNew',
                                                            caption: 'Add',
                                                            style: Terrasoft.controls.ButtonEnums.style.RED,
                                                            tag: 'addNew',
                                                            visible: true,
                                                            click: {
                                                                bindTo: 'onAddNewButtonClick'
                                                            }
                                                        }
                                            ]
                                        },
                                        {
                                            className: 'Terrasoft.Container',
                                            id: 'gridArea',
                                            selectors: {
                                                wrapEl: '#gridArea'
                                            },
                                            classes: {
                                                wrapClassName: ['container-spacing']
                                            },
                                            items: [
                                                        {
                                                            className: 'Terrasoft.Grid',
                                                            type: 'tiled',
                                                            primaryColumnName: 'Name',
                                                            activeRow: {
                                                                bindTo: 'activeRowId'
                                                            },
                                                            captionsConfig: [
                                                                        {
                                                                            cols: 12,
                                                                            name: '2'
                                                                        }
                                                            ],
                                                            columnsConfig: [
                                                                        [
                                                                                {
                                                                                    cols: 24,
                                                                                    key: [
                                                                                                {
                                                                                                    name: {
                                                                                                        bindTo: 'Name'
                                                                                                    },
                                                                                                    type: 'title'
                                                                                                }
                                                                                    ]
                                                                                }
                                                                        ]
                                                            ],
                                                            isEmpty: {
                                                                bindTo: 'gridEmpty'
                                                            },
                                                            collection: {
                                                                bindTo: 'gridData'
                                                            },
                                                            activeRowAction: {
                                                                bindTo: 'onActiveRowSelect'
                                                            },
                                                            activeRowActions: [
                                                                        {
                                                                            className: 'Terrasoft.Button',
                                                                            style: Terrasoft.controls.ButtonEnums.style.BLUE,
                                                                            caption: '4',
                                                                            tag: 'View'
                                                                        },
                                                                        {
                                                                            className: 'Terrasoft.Button',
                                                                            style: Terrasoft.controls.ButtonEnums.style.BLUE,
                                                                            caption: '5',
                                                                            tag: 'Edit'
                                                                        },
                                                                        {
                                                                            className: 'Terrasoft.Button',
                                                                            style: Terrasoft.controls.ButtonEnums.style.GREY,
                                                                            caption: '6',
                                                                            tag: 'Delete'
                                                                        }
                                                            ]
                                                        }
                                            ]
                                        }
                    ]
                });
                return container;
            }

            var getViewModel = function () {
                return Ext.create('Terrasoft.BaseViewModel', {
                    entitySchema: Ext.create("Terrasoft.BaseEntitySchema", { columns: {} }),
                    values: {
                        gridEmpty: true,
                        activeRowId: null,
                        gridData: Ext.create('Terrasoft.BaseViewModelCollection', {
                            rowConfig: { Name: 'Name'/*, Id: 'Id'*/ }
                        })
                    },
                    methods: {
                        onActiveRowSelect: function (tag) {
                            if (tag === 'Delete') {
                                this.onDeleteButtonClick();
                            } else if (tag === 'Edit') {
                                this.onEditButtonClick();
                            } else if (tag === 'View') {
                                this.onViewButtonClick();
                            }
                        },
                        onAddNewButtonClick: function () {
                            var newCardModuleId = sandbox.id + '_CardModule_' + this.entitySchema.name;
                            //renderContainer = Ext.get('centerPanel');
                            sandbox.subscribe('CardModuleEntityInfo', function (args) {
                                var entityInfo = {};
                                entityInfo.action = 'add';
                                entityInfo.cardSchemaName = 'GeneratedWebFormPage';
                                entityInfo.activeRow = '';
                                return entityInfo;
                            }, [newCardModuleId]);
                            this.cardModuleResponse = null;
                            var scope = this;
                            sandbox.subscribe('CardModuleResponse', function (response) {
                                scope.cardModuleResponse = response;
                            }, [newCardModuleId]);
                            var params = sandbox.publish('GetHistoryState');
                            sandbox.publish('PushHistoryState', { hash: params.hash.historyState });
                            sandbox.loadModule('CardModule', {
                                renderTo: renderContainer,
                                id: newCardModuleId,
                                keepAlive: true
                            })
                        },
                        onDeleteButtonClick: function () {
                            var recordId = getActiveRow(this);
                            if (recordId) {
                                var scope = this;
                                var cfg = {
                                    style: Terrasoft.MessageBoxStyles.BLUE
                                };
                                scope.showConfirmationDialog(
                                                                resources.localizableStrings.DeleteConfirmation,
                                                                function getSelectedButton(returnCode) {
                                                                    if (returnCode === Terrasoft.MessageBoxButtons.YES.returnCode) {
                                                                        var deleteQuery = Ext.create('Terrasoft.DeleteQuery', {
                                                                            rootSchemaName: 'GeneratedWebForm'
                                                                        });
                                                                        deleteQuery.filters.add('IdFilter',
                                                                                        deleteQuery.createColumnFilterWithParameter(Terrasoft.ComparisonType.EQUAL,
                                                                                                'Id', recordId));
                                                                        deleteQuery.execute(function (response) {
                                                                            scope.getData();
                                                                        }, scope);
                                                                    }
                                                                }, ['yes', 'no'], cfg);
                            }
                        },
                        onEditButtonClick: function () {
                            var recordId = getActiveRow(this);
                            sandbox.publish('PushHistoryState',
                                                        {
                                                            hash: 'GeneratedWebFormPage',
                                                            stateObj: { id: recordId }
                                                        });
                        },
                        onViewButtonClick: function () {
                            var recordId = getActiveRow(this);
                            sandbox.publish('PushHistoryState',
                                                        {
                                                            hash: 'GeneratedWebFormPage',
                                                            stateObj: { id: recordId }
                                                        });
                        },
                        onLoad: function () {
                            loadGridData(this);
                        }
                    }
                });
            }
           
            function loadGridData(scope) {
                var request = Terrasoft.AjaxProvider.request({
                    url: "../rest/TestService/TestServiceMethod",
                    headers: {
                        'Accept': 'application/json',
                        'Content-Type': 'application/json'
                    },
                    method: 'POST',
                    jsonData: 'plaintext',
                    callback: function (request, success, response) {
                        if (success) {
                            loadGridDataFromJson(response.responseText, scope);
                        }
                    },
                    scope: this
                });
            }
           
            function loadGridDataFromJson(dataJson, scope) {

                var data = Ext.JSON.decode(dataJson);
                data = Ext.JSON.decode(data.TestServiceMethodResult);
                var newCollection = Ext.create("Terrasoft.Collection");
                Terrasoft.each(data, function (item, key) {
                    var model = Ext.create("Terrasoft.BaseViewModel", {
                        rowConfig: {
                            Id: {
                                columnPath: "Id",
                                dataValueType: Terrasoft.DataValueType.GUID
                            },
                            Name: {
                                columnPath: "Name",
                                dataValueType: Terrasoft.DataValueType.TEXT
                            }
                        },
                        values: {
                            Id: Terrasoft.generateGUID(),
                            Name: item.Name
                        }
                    });
                    newCollection.add(model.get("Id"), model);
                }, this);
                var testGridData = scope.get("gridData");
                scope.set("gridEmpty", newCollection.getCount() === 0);
                testGridData.loadAll(newCollection);

            }

            function getActiveRow(scope) {
                var activeRow = scope.get('activeRowId');
                if (activeRow) {
                    var gridData = scope.get('gridData');
                    return gridData.get(activeRow);
                }
                return null;
            }

            function init() {

            }

            function render(renderTo) {
                renderContainer = renderTo;
                if (viewModel) {
                    var config = getView();
                    var view = Ext.create(config.className || 'Terrasoft.Container', config);
                    view.bind(viewModel);
                    view.render(renderTo);
                    return;
                }
                var view = getView();
                viewModel = getViewModel();
                view.bind(viewModel);
                view.render(renderTo);
            }

            return {
                init: init,
                render: render
            }
        });

и WCF-сервис, возвращающий пары Id, Name.
Сейчас при переходе в модуль данные не подгружаются:

Судя по всему, почему-то не отрабатывает метод onLoad в getViewModel(). В чем может быть ошибка?

Заранее спасибо

Нравится

1 комментарий

Здравтсвуйте, Акмаль!
Метод onLoad и не должен сам по себе вызываться. Вам необходимо его явно вызвать в init или в render.

Показать все комментарии