Skip to main content

I am trying to create a button that among other things moves the screen from one tab to another Much like a wizard would do.   

But I can’t seem to find anything that allows me to do this in actions.  Any Ideas?

Hi Alward, yes this is possible in Skuid. You can assign tabs a unique Id in the tab’s advanced properties and then reference these unique ids in Javascript and URL hashes (#). You can also reference tabs by their index number (0 for the first tab, 1 for the second, etc.)


Here’s a simple v1 page that uses a snippet to navigate to a new tab.


<skuidpage unsavedchangeswarning="yes" personalizationmode="server" showsidebar="true" showheader="true">
<models/>
<components>
<tabset rememberlastusertab="false" defertabrendering="true" uniqueid="sk-NG2-325">
<tabs>
<tab name="Tab 1" uniqueid="tab1">
<components>
<buttonset uniqueid="sk-NGS-452" position="left">
<buttons>
<button type="multi" label="Go to Tab 2" uniqueid="sk-NGU-459" window="parent" url="/apex/skuid__ui?page=Community_tabNavigation#tab2">
<actions>
<action type="custom" snippet="tab2"/>
</actions>
</button>
</buttons>
</buttonset>
</components>
<oninitialshowactions/>
<onshowactions/>
</tab>
<tab name="Tab 2" loadlazypanels="true" uniqueid="tab2">
<components/>
</tab>
</tabs>
</tabset>
</components>
<resources>
<labels/>
<javascript>
<jsitem location="inlinesnippet" name="tab2" cachelocation="false">var params = argumentse0],
$ = skuid.$;
//navigate to the second tab in the set (0 is first tab, 1 is second tab, etc.)
skuid.$("#sk-NG2-325").tabs( "option", "active", 1 );</jsitem>
</javascript>
<css/>
<actionsequences/>
</resources>
<styles>
<styleitem type="background" bgtype="none"/>
</styles>
</skuidpage>

For more detailed information check out https://community.skuid.com/t/tabset-javascript-navigation. Hope this helps to get you started!


Reply