停止在Marionette.js渲染

时间:2014-06-25 05:22:57

标签: javascript marionette

我需要关闭onRender方法中的当前区域并显示不同的区域。但是在一个运行的操作员返回后#39;我再次看到旧区域。 请告诉我我的错误。

ApplicationPageLayout = Backbone.Marionette.Layout.extend({
  template: "#application-page-layout-template",

  regions: {
    footerRegion: "#footer",
    navigationRegion: "#navigation",
    contentRegion: "#content"
  },

  onRender: function() {

    if (this.options.postName) {
        var footerData = {};
        switch (this.options.postName) {
        case "Admin":
            this.footerRegion.show(new AdminFooterView());
            break;
        case "Dispatcher":
            this.footerRegion.show(new DispatcherFooterView());
            break;
        default:
            debugger; // See current region.
            MainApplication.mainRegion.show(new LoginPageLayout(), { preventDestroy: true }); 
            debugger; // See new region LoginPageLayout. 
            return; // Again see old region.
     }
    }
  }
});

1 个答案:

答案 0 :(得分:0)

Ishow所有代码:

/**
 * Main javaScript file. 
 */
MainApplication = new Backbone.Marionette.Application();

LoginPageLayout = Backbone.Marionette.Layout.extend({
    template: "#login-page-layout-template",

    regions: {
        authorizationFormRegion: "#login-form-wrapper",
        errorRegion: "#login-message-wrapper"
    },

    // Show login form.
    onRender: function () {
        this.loginFormView = new LoginFormView();
        this.authorizationFormRegion.show(this.loginFormView);
    },

    events: { 
        "click #login-button": "login"
    },

    login: function () {
        var httpParameters = {pin: this.loginFormView.ui.pinCodeField.val()};
        var thisLayout = this;
        $.ajax({
            url: '../autorisation',
            type: 'POST',
            data: httpParameters,
            success: function(data) {
                if (data.isSuccessfully) {
                    MainApplication.mainRegion.show(new ApplicationPageLayout(data), { preventDestroy: true });
                } else {
                    var textMessageModel = new Backbone.Model({
                        message: "Ошибка. Учетная запись не найдена."
                    });

                    var loginMessageView = new LoginMessageView({
                        model: textMessageModel
                    });

                    thisLayout.errorRegion.show(loginMessageView);
                }
            },
            error: function(data) {
                alert("Сервер временно недоступен.");
            }
        });
        return false;
    }

});


ApplicationPageLayout = Backbone.Marionette.Layout.extend({
    template: "#application-page-layout-template",

    regions: {
        footerRegion: "#footer",
        navigationRegion: "#navigation",
        contentRegion: "#content"
    },

    onRender: function() {

        if (this.options.postName) {
            var footerData = {};
            switch (this.options.postName) {
            case "Диспетчер":
                this.footerRegion.show(new DispatcherFooterView());
                break;
            case "Администратор":
                footerData.title = "Панель aдминитратора";
                break;
            default:
                this.close();
         }
        }


    }
});

FooterView = Backbone.Marionette.ItemView.extend({
    regions: {
        staffLogo: "#staff-logo"
    },

    ui: {
        staffLogo: "#staff-logo"
    }
});

DispatcherFooterView = FooterView.extend({
    template: "#dispatcher-footer-template",

    events: { 
        "click #dispatcher-logo": "showAlerts"
    }
});

LoginFormView = Backbone.Marionette.ItemView.extend({
    template: "#login-form-template", 
    ui: {
        loginButton: "#login-button",
        pinCodeField: "#login-pin"
    }
});

LoginMessageView = Backbone.Marionette.ItemView.extend({
    template: "#login-message-template"
});

MainApplication.addInitializer(function(options) {

    MainApplication.addRegions({
        mainRegion: "#mainRegion"
    });

    MainApplication.mainRegion.show(new LoginPageLayout());
  });

$(function() {
    MainApplication.start();
});