---
title: "How to: Trigger and Initializer Component With a Button"
slug: "use-case-triggering-initializers-with-buttons"
description: "Learn to configure an Initializer component with Radio Buttons and a Button to automate responses in your application. Simple setup guide included!"
updated: 2026-02-02T20:32:41Z
published: 2026-02-03T15:48:58Z
canonical: "docs.unqork.io/use-case-triggering-initializers-with-buttons"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.unqork.io/llms.txt
> Use this file to discover all available pages before exploring further.

# How to: Trigger and Initializer Component With a Button

**UDesigner**

You might use an [Initializer](/v1/docs/initializer-component) component to automatically answer a set of questions. Or connect it to a [Plug-In](/v1/docs/plug-in-component) component that controls an API call. Whatever function your Initializer component serves, you have a couple of options for triggering it. To trigger your Initializer component manually, you'll use a [Button](/v1/docs/button-component) component.

In this how-to guide, you'll configure your Initializer component and reference its Property ID when configuring your Button component. In this example, you'll create a simple application with two **Yes** or **No** questions. Then, you'll add an Initializer component to select **Yes** for both questions. Instead of having the Initializer component handle the action automatically, you’ll use a Button component to serve as the trigger. When your end-user clicks the button, both answers will display as **Yes**.

### Configure the Radio Buttons Components

First, create the questions using two [Radio Buttons](/v1/docs/radio-buttons-component) components.

1. In the Module Builder, drag and drop a **Radio** **Buttons** component onto your canvas.
2. In the **Property ID** field, enter `completeApplication`.
3. In the **Label Text** field, enter `Did you complete this application yourself?`.
4. Complete the **Values** table as follows:

| # | Label | Value |
| --- | --- | --- |
| 1 | Yes | yes |
| 2 | No | no |
5. Click **Save Component**.
6. Drag and drop another **Radio** **Buttons** component onto your canvas, placing it below the previous one.
7. In the **Property ID** field, enter `applicationStarted`.
8. In the **Label Text** field, enter `Did you start this application less than one month ago?`.
9. Complete the **Values** table as follows:

| # | Label | Value |
| --- | --- | --- |
| 1 | Yes | yes |
| 2 | No | no |

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(854).png?sv=2026-02-06&spr=https&st=2026-11-06T21%3A38%3A16Z&se=2026-11-06T22%3A38%3A16Z&sr=c&sp=r&sig=31qmLp2kguo7vXgIB1TJWaHzx4HvrR9p%2BoaorLGp9wE%3D)
10. Click **Save Component.**

### Configure the Initializer Component

Next, let's set up your [Initializer](/v1/docs/initializer-component) component to send `yes` values to both of your questions.

1. Drag and drop an **Initializer** component onto your canvas, placing it below your Radio Buttons components.
2. In the **Property ID** and **Label Text** field, enter `initRadioButtons`.
3. In the **Outputs** table, enter the following:

| # | Source | Type | Value |
| --- | --- | --- | --- |
| 1 | applicationStarted | value | yes |
| 2 | completeApplication | value | yes |

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(856).png?sv=2026-02-06&spr=https&st=2026-11-06T21%3A38%3A16Z&se=2026-11-06T22%3A38%3A16Z&sr=c&sp=r&sig=31qmLp2kguo7vXgIB1TJWaHzx4HvrR9p%2BoaorLGp9wE%3D)
4. Click **Save Component**.

### Configure the Button Component

Lastly, you'll add a [Button](/v1/docs/how-to-guide-button-component) component to trigger your Initializer component.

1. Drag and drop a **Button** component onto your canvas, placing it below your Initializer component.
2. In the **Property ID** field, enter `btnYesToAll`.
3. In the **Label Text** field, enter `Yes To All`.
4. From the **Action Type** drop-down, select **Event**.
5. From the **On Click** drop-down, select **initRadioButtons**.

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(857).png?sv=2026-02-06&spr=https&st=2026-11-06T21%3A38%3A16Z&se=2026-11-06T22%3A38%3A16Z&sr=c&sp=r&sig=31qmLp2kguo7vXgIB1TJWaHzx4HvrR9p%2BoaorLGp9wE%3D)
6. Click **Save Component**.
7. **Save** your module.

Here's how your completed example looks in the Module Builder:

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(858).png?sv=2026-02-06&spr=https&st=2026-11-06T21%3A38%3A16Z&se=2026-11-06T22%3A38%3A16Z&sr=c&sp=r&sig=31qmLp2kguo7vXgIB1TJWaHzx4HvrR9p%2BoaorLGp9wE%3D)

Preview your module in Express View and click the **Yes To All** button. You'll see the answers to your questions automatically display as **Yes**.

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Buttons_TriggerInit_Express.gif?sv=2026-02-06&spr=https&st=2026-11-06T21%3A38%3A16Z&se=2026-11-06T22%3A38%3A16Z&sr=c&sp=r&sig=31qmLp2kguo7vXgIB1TJWaHzx4HvrR9p%2BoaorLGp9wE%3D)

**Classic Designer**

You might use an [Initializer](/v1/docs/initializer-component) component to automatically answer a set of questions. Or connect it to a [Plug-In](/v1/docs/plug-in-component) component that controls an API call. Whatever function your Initializer component serves, you have a couple of options for triggering it. To trigger your Initializer component manually, you'll use a [Button](/v1/docs/button-component) component.

In this how-to guide, you'll configure your Initializer component and reference its Property ID when configuring your Button component. In this example, you'll create a simple application with two **Yes** or **No** questions. Then, you'll add an Initializer component to select **Yes** for both questions. Instead of having the Initializer component handle the action automatically, you’ll use a Button component to serve as the trigger. When your end-user clicks the button, both answers will display as **Yes**.

### Configure the Radio Buttons Components

First, create the questions using two [Radio Buttons](/v1/docs/radio-buttons-component) components.

1. In the Module Builder, drag and drop a **Radio Buttons** component onto your canvas.
2. In the **Property ID** field, enter `completeApplication`.
3. In the **Label Text** field, enter `Did you complete this application yourself?`.
4. Complete the **Values** table as follows:

| # | Option Label | Value to Store in Submission Data |
| --- | --- | --- |
| 1 | Yes | yes |
| 2 | No | no |
5. Click **Save & Close**.
6. Drag and drop another **Radio Buttons** component onto your canvas, placing it below the previous one.
7. In the **Property ID** field, enter `applicationStarted`.
8. In the **Label Text** field, enter `Did you start this application less than one month ago?`.
9. | # | Option Label | Value to Store in Submission Data |
| --- | --- | --- |
| 1 | Yes | yes |
| 2 | No | no |

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(859).png?sv=2026-02-06&spr=https&st=2026-11-06T21%3A38%3A16Z&se=2026-11-06T22%3A38%3A16Z&sr=c&sp=r&sig=31qmLp2kguo7vXgIB1TJWaHzx4HvrR9p%2BoaorLGp9wE%3D)
  1. Complete the **Values** table as follows:
10. Click **Save & Close**.

### Configure the Initializer Component

Next, let's set up your [Initializer](/v1/docs/initializer-component) component to send `yes` values to both of your questions.

1. Drag and drop an **Initializer** component onto your canvas, placing it below your Radio Buttons component.
2. In the **Property ID** and **Canvas** **Label Text** field, enter `initRadioButtons`.
3. In the **Outputs** table, enter the following:

| # | Property ID | Type | Value |
| --- | --- | --- | --- |
| 1 | applicationStarted | value | yes |
| 2 | completeApplication | value | yes |

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(860).png?sv=2026-02-06&spr=https&st=2026-11-06T21%3A38%3A16Z&se=2026-11-06T22%3A38%3A16Z&sr=c&sp=r&sig=31qmLp2kguo7vXgIB1TJWaHzx4HvrR9p%2BoaorLGp9wE%3D)
4. Click **Save & Close**.

### Configure the Button Component

Lastly, you'll add a [Button](/v1/docs/how-to-guide-button-component) component to trigger your Initializer component.

1. Drag and drop a **Button** component onto your canvas, placing it below your Initializer component.
2. In the **Property ID** field, enter `btnYesToAll`.
3. In the **Label Text** field, enter `Yes To All`.
4. Set the **Action Type** as **Event**.
5. From the **On Click** drop-down, select **initRadioButtons**.

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(861).png?sv=2026-02-06&spr=https&st=2026-11-06T21%3A38%3A16Z&se=2026-11-06T22%3A38%3A16Z&sr=c&sp=r&sig=31qmLp2kguo7vXgIB1TJWaHzx4HvrR9p%2BoaorLGp9wE%3D)
6. Click **Save & Close**.
7. **Save** your module.

Here's how your completed exxample looks in the Module Builder:

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(862).png?sv=2026-02-06&spr=https&st=2026-11-06T21%3A38%3A16Z&se=2026-11-06T22%3A38%3A16Z&sr=c&sp=r&sig=31qmLp2kguo7vXgIB1TJWaHzx4HvrR9p%2BoaorLGp9wE%3D)

Preview your module in Express View and click the **Yes To All** button. You'll see the answers to your questions automatically display as **Yes**.

![](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/Buttons_TriggerInit_Express.gif?sv=2026-02-06&spr=https&st=2026-11-06T21%3A38%3A16Z&se=2026-11-06T22%3A38%3A16Z&sr=c&sp=r&sig=31qmLp2kguo7vXgIB1TJWaHzx4HvrR9p%2BoaorLGp9wE%3D)

APIs (application programming interfaces) are a set of protocols and definitions developers use to build and integrate application software. APIs act as the connective tissue between products and services.

Triggers activate another component when certain requirements are met. Trigger types include Concurrent, Post, and Error. Some components do not have the ability to trigger others.

In Unqork an application is a program used to perform specific tasks. An application can be one of two types: workflow or module.

End-users, also known as Express Users, are the individuals accessing an application through Express View. In most cases, end-users are the customers using the product.

Express View is how your end-user views your application. Express View also lets you preview your applications to test your configuration and view the styling. This is also the view your end-users will see when interacting with your application. After configuring a module, click Preview in the Module Builder to interact with the module in Express View.