In Openblocks, event handlers are responsible for collecting and processing events from components and queries, and executing subsequent actions. For example, for a **Button** component, you can add an event handler to trigger the **Run query** action **** in response to the button **Click** event.

Set event handlers wisely to provide a reactive and responsive user experience (UX). For example, triggering a **get-all** query after **insert-new-data** query finishes enables table automatically refresh.

There are a number of event handler actions available in Openblocks for handling different scenarios. Set them in the **Action** dropdown list in an event handler.

{% hint style="info" %}

See [advanced](event-handlers.md#advanced) on this page to know advanced settings.

To control a component, select a component in the **Component** dropdown list and call one of its methods in the **Method** dropdown list.

<figure><img src="../.gitbook/assets/module-1.png" alt=""><figcaption><p>Build a <a href="module.md#demo-a-statistics-module">statistics module</a></p></figcaption></figure>

When editing an app or module, select **Insert > Extensions > Modules** to display the modules that you have access to.&#x20;

Then drag and drop the module onto the canvas, and set input parameters, change styles inside the module's **Properties** panel.

This section guides you through the steps to build a statistics module and reuse it in an app. &#x20;

1. Create module inputs:

<figure><img src="../.gitbook/assets/module-17.png" alt=""><figcaption></figcaption></figure>

5. Reuse the module multiple times by passing different input values.&#x20;