# Switching Tabs With Button Click

> When you configure multiple tabs, you can add a **Button** component, that switches to the next tab. This tutorial demonstrates how to create a **Button** component that switches to the next tab.

When you configure multiple tabs, you can add a **Button** component, that switches to the next tab. This tutorial demonstrates how to create a **Button** component that switches to the next tab.

![docs image](https://dev-assets.cms.uipath.com/assets/images/activities/activities-docs-image-181028-e2dc0352.gif)

## Tutorial

To create the customized Button component:

1. Drag and drop a **Button** component into your form.
2. In the **Display** tab of the Button component, set the **Action** property to **Click**.
3. Check **Use for Local Update**.
4. Configure the Button component to switch to the second tab in the **Update Data Logic** section.
5. Configure the tab control to display the second tab. In this example, we want the `Q2` tab to display when clicking the button. 
   When setting the second tab, reference it as **Tab(1)**, because we are dealing with 0-based indexes. 
   For this example, copy, and paste the script below, to configure the tab control. [you need to specify where the user has to paste the script]
   ```
   var tabs = form.getComponent('tabs');
   tabs.setTab(1);
   ```
6. Use the additional script below that enables the **Do Block** to run when switching to the second tab. This step is optional, created to demonstrate the number of times the Button component is clicked.
   ```
   instance.emit('executeDoBlock', instance.component);
   ```
7. Save the component and the form.

## Sample workflow

To check the complete workflow or to have a future reference, download the [XAML example](https://documentationexamplerepo.blob.core.windows.net/examples/Forms/Switch_Tabs_Sample.xaml)