Results 1 to 4 of 4

Thread: BasicDialog and Wizard

  1. #1

    Default BasicDialog and Wizard

    Hello

    I've just seen the YAHOO.ext.BasicDialog and the autotab property and i'd like to do a wizard simply.

    I'll create a BasicDialog with for example 3 tabs and a next button and a cancel button.
    only the first tab is enable.

    when i click on the next button, i'll activte the second tab and add a previous button and desactivate the first tab.

    when i click on the next button, i'll activte the third tab and delete the next button and desactivate the second tab.

    It appear to be very simple.

    But i wonder how to do the following things with a BasicDialog:

    - remove a button.
    - rename a button.
    - change the onclick action of a button.
    - activate a tab.
    - desactivate a tab.


    Thanks for the response.

    ALEX

  2. #2
    Sencha User jack.slocum's Avatar
    Join Date
    Mar 2007
    Location
    New York, NY
    Posts
    6,956

    Default

    - remove a button.
    addbutton returns a new button object that you can use to disable/enable and show/hide.

    var btn = dialog.addButton(...);

    show:
    btn.getEl().setStyle('display', '');
    hide:
    btn.getEl().setStyle('display', 'none');

    Because these are common things, I just added a show and hide to the button object to make it easier. That will be in the next build.

    - rename a button.


    I assume you mean set the text. Currently it's a pain, I've also prototyped this in for you.

    - change the onclick action of a button.
    The button has two properties, handler and scope. You can change them at any time.
    btn.handler = myFunction;
    btn.scope = myObject;

    To make this easier, I added a setHandler function.

    - activate a tab.
    - desactivate a tab.


    BasicDailog has a function getTabs() that will return the TabPanel component it uses.

    Here's the updated Button prototype that you can include after yui-ext.js to gain the new functions until the next build.

    Code:
    YAHOO.ext.BasicDialog.Button.prototype = {
        getEl : function(){
            return this.el;  
        },
        
        setHandler : function(handler, scope){
            this.handler = handler;
            this.scope = scope;  
        },
        
        setText : function(text){
            this.el.dom.firstChild.firstChild.firstChild.childNodes[1].innerHTML = text;    
        },
        
        show: function(){
            this.el.setStyle('display', '');    
        },
        
        hide: function(){
            this.el.setStyle('display', 'none');    
        },
        
        focus : function(){
            this.el.focus();    
        },
        
        disable : function(){
            this.el.addClass('ydlg-button-disabled');
            this.disabled = true;
        },
        
        enable : function(){
            this.el.removeClass('ydlg-button-disabled');
            this.disabled = false;
        },
        
        onClick : function(e){
            e.preventDefault();
            if(!this.disabled){
                this.handler.call(this.scope || window);
            }
        },
        onMouseOver : function(){
            if(!this.disabled){
                this.el.addClass('ydlg-button-over');
            }
        },
        onMouseOut : function(){
            this.el.removeClass('ydlg-button-over');
        },
        onMouseDown : function(){
            if(!this.disabled){
                this.el.addClass('ydlg-button-click');
            }
        },
        onMouseUp : function(){
            this.el.removeClass('ydlg-button-click');
        }    
    };

  3. #3

    Default

    Thanks a lot Jack.

    I'll try it as soon as posible.

    If i can manage a class which can do a wizard very easy, i'll give you the code if you want it.


    Thanks again.

  4. #4
    Sencha User jack.slocum's Avatar
    Join Date
    Mar 2007
    Location
    New York, NY
    Posts
    6,956

    Default

    Sounds good. Thanks.

Similar Threads

  1. Wizard like dialog
    By tinezorko in forum Ext 1.x: Help & Discussion
    Replies: 0
    Last Post: 28 Dec 2006, 6:08 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •