How to show or hide tab in dialog in cq5

[srinuetta]

Hi,

I have a requirement where based on radio button i need to show the tab when not selected i need to hide.

Please let me know how to achieve or examples please.

[karan131]

You can see the default list component (/libs/foundation/components/list). They have implemented this with dropdown and same can be done with radio buttons.

[Former Community Member · Accepted solution]

By using the listener its quite easy to achieve your question. 

Step 1: give the tab to show/hide an ID

<tab2 jcr:primaryType="cq:Panel" title="tab2" itemId="tab2"> ... </tab2>

Step 2: add a listener to the selection which you want to handle:

If the selection is 'no' the tab will be disabled, otherwise enabled.

<select jcr:primaryType="cq:Widget" fieldLabel="ShowTab" name="./show" type="radio" value="yes" xtype="selection"> <options jcr:primaryType="cq:WidgetCollection"> <option1 jcr:primaryType="nt:unstructured" text="Yes" value="yes"/> <option2 jcr:primaryType="nt:unstructured" text="No" value="no"/> </options> <listeners jcr:primaryType="nt:unstructured" selectionchanged="function( field,value, isChecked ){ if (field !=null){ var d = field.findParentByType('tabpanel'); if (value == 'no'){ d.hideTabStripItem('tab2'); }else{ d.unhideTabStripItem('tab2'); } } }"/> </select>

[Nitin_Harikant]

Does this work ??

d.hideTabStripItem('tab2');

i believe it should be d.hideTabStripItem(1);

[kautuk_sahni]

nitinh81834186 wrote...

Does this work ??

d.hideTabStripItem('tab2');

i believe it should be d.hideTabStripItem(1);

Excellent.  you are correct, the arguments must be index [hideTabStripItem(index) ].

~kautuk