CODEWITHSUNDEEP
dojo
khurshid
khurshid

Reputation: 35

how to disable single tab in dojo tabcontainer

i want to disable single tab in tabcontainer of dojo .

Upvotes: 0

Views: 6840

Answers (7)

Niek Vandael
Niek Vandael

Reputation: 394

You can disable tabs by setting the disabled property of the pane: Source: https://dojotoolkit.org/reference-guide/1.10/dojo/dom-style.html

pane.set("disabled", true);

Example:

<div data-dojo-type="dijit/layout/TabContainer" style="width: width: 350px;     height: 200px">
    <div data-dojo-type="dijit/layout/ContentPane" title="My first tab" data-    dojo-props="selected:true">
        Lorem ipsum and all around...
    </div>
    <div data-dojo-type="dijit/layout/ContentPane" id="second" title="My second     tab">
        Lorem ipsum and all around - second...
    </div>
    <div data-dojo-type="dijit/layout/ContentPane" title="My last tab" data-    dojo-props="closable:true">
        Lorem ipsum and all around - last...
    </div>
</div>

<script type="dojo/require">
    registry: "dijit/registry"
</script>
<button type=button onclick="registry.byId('second').set('disabled',     !registry.byId('second').get('disabled'));">
    toggle tab #2 disabled
</button>

Only problem here is that it's not visible to the user they can't click on it. You can these additional CSS selectors:

.dijitTab.dijitDisabled { 
    cursor: not-allowed !important;
}

.dijitTab.dijitDisabled > .tabLabel{
    cursor: not-allowed !important;
}

Upvotes: 0

Nicolas I
Nicolas I

Reputation: 234

dojo.attr(dijit.byId('tab'), "disabled", true);
dijit.byId('tab').onClick = function () { };

Upvotes: 0

mleahy
mleahy

Reputation: 93

Here's my workaround for this problem:

dojo.style(dijit.byId("tabID").controlButton.domNode,{display:"none"});

and:

dojo.style(dijit.byId("tabID").controlButton.domNode,{display:"inline-block"});

For some reason, altering the disabled property, or calling setDisabled does nothing for me.

Upvotes: 5

Andrew Bucklin
Andrew Bucklin

Reputation: 699

I answered this question in another thread. Basically it involved getting jQuery involved. Works great for me. I have all the tabs created statically (as opposed to programatically) and I'm able to manipulate whether they are shown or hidden with the help on jQuery. All the code any everything is in my post here:

How do I dynamically show and hide an entire TabContainer using DOJO?

Upvotes: 1

zjnge
zjnge

Reputation: 11

dijit.byId('tab').controlButton.domNode.disabled = true

Upvotes: 1

kurtinatlanta
kurtinatlanta

Reputation: 108

You can't do it directly since this is not a feature of the DOJO tab container. There has been a bug against DOJO, open for about 3 years, to add the feature: http://bugs.dojotoolkit.org/ticket/5601

That defect also has a potential workaround in it.

Upvotes: 1

virsir
virsir

Reputation: 15489

You can override its default css to make the tabbar invisible.

Upvotes: 0

Related Questions