CODEWITHSUNDEEP
dojotabcontainer
Biren
Biren

Reputation: 31

How do I stop dijit.layout.TabContainer from switching tabs, based on the state of the data in the tab?

I know how to disable tabs, etc.

This is about preventing an onclick event from switching to an active tab, if the user hasn't met a condition.

Is there a function that I can connect to that will pass me an event I can use dojo.stopEvent() on?

Upvotes: 2

Views: 1867

Answers (2)

Cody
Cody

Reputation: 123

You can also do this with aspect.

aspect.around(tabContainer, "selectChild", function(selectChild) {
        return function(page) {
            if(confirm("Do you want to change tab?"))
                selectChild.apply(this, arguments);
        }
});

Fiddle: http://jsfiddle.net/vmsuu/4/

Credit to Fredde: http://dojo-toolkit.33424.n3.nabble.com/dijit-layout-TabContainer-Confirm-message-on-switching-tabs-td3990778.html

Upvotes: 3

Darktalker
Darktalker

Reputation: 346

I have the same problem, there is no direct way to do it, but you can extend your widget:


dojo.extend(dijit.layout.TabController, {
    onButtonClick: function(/*dijit._Widget*/ page,evt) {
        // summary:
        //      Called whenever one of my child buttons is pressed in an attempt to select a page
        // tags:
        //      private
        this.beforeButtonClick(page,evt);
        this._onButtonClick(page,evt);

    },
    beforeButtonClick:function(page,evt){

    },
    _onButtonClick:function(page,evt){
        console.log(evt.cancelBubble);
        if(evt.cancelBubble){
            return;
        }
        var container = dijit.byId(this.containerId);
        container.selectChild(page);
    }
});

the usage is:


var widget = dijit.byId('your_tabContainer');
dojo.connect(widget.tablist,"beforeButtonClick",function(page,evt){
//do the detection, if it meet the condition, ignore it,
//if not, stop the event
   if(page.id !== "tab1"){
      dojo.stopEvent(evt)
   }
});

Upvotes: 2

Related Questions