Tabs in Appian Interface

RE: Tabs in Appian Interface

GopalK — Tue, 15 Feb 2022 13:23:21 GMT

Hi, you can go through below link. it can solve your problem.

https://docs.appian.com/suite/help/21.4/tabs-pattern.html

RE: Tabs in Appian Interface

Md Shafiuddin — Tue, 15 Feb 2022 12:56:22 GMT

I need to add 30+ tabs in a single interface, Can you please share the code...

Apoorva or Sandeep

RE: Tabs in Appian Interface

Md Shafiuddin — Tue, 15 Feb 2022 12:54:41 GMT

Hi, If your problem solved, can you pls share the code because i also have same task

RE: Tabs in Appian Interface

Md Shafiuddin — Tue, 15 Feb 2022 12:54:27 GMT

Hi, If your problem solved, can you pls share the code because i also have same task

RE: Tabs in Appian Interface

chandu — Sat, 28 Apr 2018 12:02:24 GMT

Hi,
All of the above recommendations are good, but still you need to visualise the UI or try the UI,
Using Images as suggested by Rajat is good one when used with new side by side layout. But when you want to change any label, We need to change the Image.

RE: Tabs in Appian Interface

rajats246 — Sat, 28 Apr 2018 06:52:16 GMT

You can use image link field and create tab like image to select and show the section on the basis of selection. for each tab u will require two buttons when it is selected and when it is not selected . while the tab is selected its base line should not be visible that's how you have to selected the image.

RE: Tabs in Appian Interface

santoshd378 — Fri, 27 Apr 2018 10:43:09 GMT

Hey Apoorva,

We can implement the tabs but not the exact way you have shown in the image

Currently I have shown only two tabs, If you want you can include more.

load(
local!currentTab:1,
with(
local!finalTab: local!currentTab,
a!formLayout(
label: "Something",
contents: {
a!richTextDisplayField(
          value: {
            a!richTextItem(
              text: "First Tab" & " ",
              link: a!dynamicLink(
                value: "1",
                saveInto: local!tab
              )
            )
            a!richTextItem(
              text: "  | ",
              style: "STRONG"
            ),
            a!richTextItem(
              text: "Second Tab" & " ",
              link: a!dynamicLink(
                value: "2",
                saveInto: local!tab
              )
            )
          }
        ),
        if(local!currentTab=1,call your first interface,{}),
        if(local!currentTab=2,call your second interface,{})
        }
        )
        )
        )

RE: Tabs in Appian Interface

Shivam Gupta — Thu, 26 Apr 2018 12:33:20 GMT

The same view will not be possible in Appian
One way to do so is as mentioned in comments the Button Layout
However you can do the tabular view using links as well. In each of the link just provide the a!dynamic link to store the value of the tab.

RE: Tabs in Appian Interface

jaidw — Thu, 26 Apr 2018 11:20:48 GMT

apoorvam I suggest you to use clickable milestone field. It looks much better than buttons. In case you need to show number of tabs then look and feel will not be good (This is my perspective) if you are using buttons. Instead of that clickable milestones looks fabulous.

RE: Tabs in Appian Interface

Aditya — Thu, 26 Apr 2018 10:14:46 GMT

You can create a button layout and then use the choose() function to display various tabs based on the buttons clicked.

RE: Tabs in Appian Interface

apoorvam — Thu, 26 Apr 2018 10:00:44 GMT

This is great, thanks for the quick response, I will try. Just wanted to confirm my understanding.

RE: Tabs in Appian Interface

Sandeep Deshmukh — Thu, 26 Apr 2018 09:58:15 GMT

Hi apoorvam ,

Sorry, I cannot.
I can share sample code :
a!formLayot(
firstColumnContents:{
a!buttonLayout(
primaryButtons:{
a!buttonWidget(
label:"One"
),
a!buttonWidget(
label:"Two"
),
a!buttonWidget(
label:"Three"
)
}
)})

Please try this.

RE: Tabs in Appian Interface

apoorvam — Thu, 26 Apr 2018 09:27:31 GMT

Thank you Sandeep. Would it be possible for you to popst a snippet of that code?

RE: Tabs in Appian Interface

Vinay Kumar Rai — Thu, 26 Apr 2018 07:35:39 GMT

Hi,

1) You can create the same interface using Embedded Interface, use the same template. but you should have a good knowledge of JavaScript and CSS
docs.appian.com/.../Embedded_Interfaces.html

2) Use the Buttons which work as a TAB, change the Color of the Button when selected. it is quite simple to implement

RE: Tabs in Appian Interface

Sandeep Deshmukh — Thu, 26 Apr 2018 07:35:30 GMT

Hi apoorvam ,

We cannot create tabs in Interface but it I can suggest buttonLayout for this. Use Primary Button at top of your screen and just show/hide the section based on the button clicks. It will work like a tab only. I did the same in my current project.

Thanks,
Sandeep

RE: Tabs in Appian Interface

Brazil Vibanco — Thu, 26 Apr 2018 07:35:24 GMT

You can use tabs within a record, as additional views.
Also you can set buttons on top your interface simulating tabs, clicking on each button you can refresh your interface.

Thanks

RE: Tabs in Appian Interface

Dastagiri Dudekula — Thu, 26 Apr 2018 07:06:12 GMT

You can use record with additional views.
You can use site with different pages.
But look and feel might vary and there are certain operational constraints that may restrict us in implementing this.