YUI3 view events object do not fire events

57 Views Asked by At

YUI3 custom view module do not calls showPanel() function whn the user clicks to the Y.SpHeader (view) should call showPanel event handler.

the code Does not throw any error in console it simply do not work. and not logging in console that the button is clicked.

    YUI.add('sp-header-section', function(Y){
    Y.SpHeader = Y.Base.create('sp-header-section', Y.View, [], {
        events: {
            '#sign-up': {'click': "showPanel"}
        },

        initializer: function(config){
            this._initPanel();
        },

        render: function(){
            new Y.SpDropdownMenu({
                contentBox: "#top_menu",
                descriptions: true
            }).render();        
        },

        // Private Methods
        _initPanel: function(){
          var okButton = this.okBotton;
          var cancelButton = this.cancelButton;
          this.panel = new Y.Panel({
                width: 300,
                centered: true,
                headerContent: 'Sign Up To Recieve a Book',
                bodyContent: 'CAUTION: Watch out for random panels.',
                zIndex: 999,
                modal: true,

            });  
        },

        showPanel: function(){
            Y.log('the button is clicked');
            this.panel.reder();  
        },

        // Panel Buttons Configurations
        okButton: {
            value: 'ok',
            section: Y.WidgetStdMod.FOOTER,
            action: function (ev) {
                ev.preventDefault();
                this.hide();
            }
        },

        cancelButton: {
            value: 'cancel',
            section: Y.WidgetStdMod.FOOTER,
            action: function (ev) {
                ev.preventDefault();
                this.hide();
            }
        }
    }, {
        ATTRS:{    
        }
    }); 
},'1.0', {requires: ['sp-dropdown-menu', 'panel', 'escape', 'view']});   


YUI().use('sp-header-section', function(Y){
    var header = new Y.SpHeader({}).render();
});
0

There are 0 best solutions below