Versions Compared

Old Version 23

changes.mady.by.user Musachy Barroso

Saved on

compared with

New Version 24

changes.mady.by.user Musachy Barroso

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Code Block
HTML
HTML
<script type="text/javascript">
   function enableTab(idparam) {
      var tabContainer = dojo.widget.byId('tabContainer');
      tabContainer.enableTab(idparam);
   }
    
   
   function disableTab(indexparam) {
      var tabContainer = dojo.widget.byId('tabContainer');
      tabContainer.disableTab(indexparam);
   }
</script>

<sx:tabbedpanel id="tabContainer">
   <sx:div id="tab1" label="Tab 1" >
       Local Tab 1
   </sx:div>   
   <sx:div id="tab2" label="Tab 2" disabled="true">
       Local Tab 2
   </sx:div>   
</sx:tabbedpanel>

<!-- By Tab Index -->
<input type="button" onclick="enableTab(1)" value="Enable Tab 2 using Index" />
<input type="button" onclick="disableTab(1)" value="Disable Tab 2 using Index" />
    
<!-- By Tab Id -->
<input type="button" onclick="enableTab('tab2')" value="Enable Tab 2 using Id" />
<input type="button" onclick="disableTab('tab2')" value="Disable Tab 2 using Id" />
   
<!-- By Widget -->
<input type="button" onclick="enableTab(dojo.widget.byId('tab2'))" value="Enable Tab 2 using widget" />
<input type="button" onclick="disableTab(dojo.widget.byId('tab2'))" value="Disable Tab 2 using widget" />
Set Tab labels position to bottom (can be: top, right, bottom, left)
Code Block
HTML
HTML
<sx:tabbedpanel labelposition="bottom">
   <sx:div label="Tab 1" >
       Local Tab 1
   </sx:div>   
   <sx:div label="Tab 2" >
       Local Tab 2
   </sx:div>   
</sx:tabbedpanel>

...

Code Block
HTML
HTML
<script type="text/javascript">
   dojo.event.topic.subscribe('/before', function(event, tab, tabContainer) {
      if(event.cancel = tab.widgetId == "tab1") {
         event.cancel = true;
      }tab2" ;
   });
</script>
<sx:tabbedpanel beforeSelectTabNotifyTopics="/before">
   <sx:div id="tab1" label="Tab 1">
       Local Tab 1
   </sx:div>   
   <sx:div id="tab2" label="Tab 2">
       Local Tab 2
   </sx:div>   
</sx:tabbedpanel>

...