# Events

***

### Quick access

[**Creating a New Event**](#creating-a-new-event)

* [Adding conditions](#adding-conditions)
* [Element](#element)
* [Input](#input)
* [URL](#url)

[**On Event Trigger**](#on-event-trigger)

***

## Creating a New Event

This guide will help you understand how to set up these events effectively.

<figure><img src="/files/0ZViqVFGjSMSSYEYXQmP" alt=""><figcaption></figcaption></figure>

* **Event Details (A)**:
  * *Name*: Enter the human-readable name of the event.
  * *Code name*: Provide a unique identifier for the event used within the codebase.
  * *Description*: Add additional details about what the event tracks.
* **Add Element Condition (B)**:
  * Use this to specify conditions related to elements within your application.
  * Track if an element is present, clicked, or hovered.
* **Add Input Condition (C)**:
  * Specify conditions to track user interactions with input fields.
  * Monitor when an input is being filled.
* **Add Page Condition (D)**:
  * Define conditions to track when a user navigates to a specific page URL.
* **Test Event (E)**:
  * Click this button to test the event setup.
  * Ensure the event is set up correctly and can be triggered in context within the app.
* **Save (F)**:
  * Once all conditions and details are set, click this button to save the new event.
* **Back Navigation (G)**:
  * Use this button to return to the main dashboard event list.

### Adding Conditions

Define the specific criteria under which an event will be triggered. By setting these conditions, you can capture precise user interactions that are crucial for your analysis.

<figure><img src="/files/0tDlsInwUK5bCfQctgip" alt=""><figcaption></figcaption></figure>

* **Add a Condition (A)**: Click on the "Add..." button to open the list of condition types. Select the appropriate condition based on what you want to track.
* **AND/OR Logic (B)**: Use these logical operators to combine multiple conditions within a group. The "AND" operator requires all conditions to be met, whereas the "OR" operator requires at least one condition to be met.
* **Delete Condition (C)**: If you need to remove a condition, click on the trash icon next to the condition. This allows you to easily modify your conditions without starting over.

#### **Types of Conditions**

<figure><img src="/files/C9MQmUuvsshbDLr2I9C6" alt=""><figcaption></figcaption></figure>

* **Element (A)**: This condition is triggered when a specific element on the page is present, clicked, or hovered. Use this to track interactions with buttons, links, images, or any HTML element.
* **Fills in input (B)**: This condition activates when a user fills in an input field. This is ideal for tracking form submissions, search queries, or any text input.
* **Current page (C)**: This condition is met when the user opens a specific page URL. It's useful for tracking page visits and navigation patterns.
* **Logic group (D)**: Create a new condition group using AND/OR logic to combine multiple conditions. This helps in defining complex user behaviors by grouping multiple criteria.

### Element

When setting up conditions for events, one key type is the Element Condition. This condition triggers an event based on interactions with specific elements in your application.

<figure><img src="/files/kOvjaO4dc29mh6NdHVdX" alt=""><figcaption></figcaption></figure>

* **Select Element (A):** This option allows you to choose between using the in-app selector to auto-fill element details or manually entering these details.&#x20;
  * Click "Select Element" to enter selection mode, then click the desired element in your app interface.&#x20;
  * Alternatively, use the "Manual Selector" to specify the element by entering its CSS tag or other identifying details.
* **Condition Behavior Settings (B):** Define how the event should be triggered by interactions with the targeted element. The options include:
  * **Is clicked**: Triggers the event when the element is clicked.
  * **Is hovered**: Triggers the event when the element is hovered over.
  * **Is present**: Triggers the event when the element is present on the page.
  * **Is not present**: Triggers the event when the element is not present on the page.
  * **Is disabled**: Triggers the event when the element is disabled.
  * **Is not disabled**: Triggers the event when the element is not disabled.

#### **Adjusting Element Details (Manual Selector)**

Once you've chosen the element, you can refine the details manually. This configuration helps ensure that events are triggered precisely when desired, based on user interactions with specific elements on your app.

<figure><img src="/files/OzVDWYd1Pj7ZEbiZEvsJ" alt=""><figcaption></figcaption></figure>

* **Element Text (A):** Enter the text of the element to narrow down the selection.
* **CSS Selector (B):** Specify the CSS selector for the element if known.
* **Multiple Matches (C):** Decide whether to use the first matching element or all matching elements if there are multiple.
* **Switch to Auto Selection (D):** Revert to the automatic selection method if needed.
* **When (E):** Reconfirm the specific condition interactions (clicked, hovered, present, etc.) under which the event should trigger.

### Input

When setting up conditions for events, one key type is the Input Fill Condition. This condition triggers an event based on interactions with specific input fields in your application.

<figure><img src="/files/D1nWbEWW4WQZA1p32Y6Y" alt=""><figcaption></figcaption></figure>

* **Select Input (A):** This option allows you to choose between using the in-app selector to auto-fill element details or manually entering these details.&#x20;
  * The **Select input** button opens the in-app selector, enabling you to click directly on the desired input field within your application to capture its details automatically.
  * The **Manual selector** option allows you to manually enter the CSS selector of the input field.
* **Condition Behavior Settings (B):** Define how the event should be triggered by interactions with the targeted input. [The options include](#user-content-fn-1)[^1]:
  * **Is**: Checks if the input field is filled with an exact text or values.
  * **Is not**: Checks if the input field is not filled with this text or values.
  * **Contains**: Checks if the input field contains specific text or values.
  * **Does not contain**: Checks if the input field does not contain specific text or values.
  * **Starts with**: Checks if the input field starts with certain text.
  * **Ends with**: Checks if the input field ends with certain text.
  * **Matches regular expression**: Checks if the input matches a given regular expression.
  * **Does not match regular expression**: Checks if the input does not match a given regular expression.
  * **Is empty**: Checks if the input field is empty.
  * **Is not empty**: Checks if the input field is not empty.

<figure><img src="/files/FIXyKPhHmzS5bwoCgl9g" alt=""><figcaption></figcaption></figure>

* **CSS Selector (A)**: Manually input the CSS selector for the targeted input element if not using the auto-selection feature.
* **Multiple Matches Selection (B)**: Specify whether to apply the condition to the first matching element or all matching elements.
* **Switch to Auto Selection (C)**: Option to toggle back to the auto-selection mode for ease of use.
* **Condition Criteria (D)**: Further refine the input condition by choosing [specific criteria](#user-content-fn-1)[^1] from a dropdown, such as "match regex", "is empty", "contains specific value", etc.

### URL

When setting up conditions for events, another important type is the Current Page Condition. This condition triggers an event based on the URL of the page the user is currently on.

<figure><img src="/files/7m97EFMPh8KXdDkGcIU6" alt=""><figcaption></figcaption></figure>

* **Condition Selector (A):**
  * This [dropdown menu](#user-content-fn-1)[^1] allows you to specify the type of URL condition to apply. Options include:
    * **Is:** The URL exactly matches the specified string.
    * **Is not:** The URL does not match the specified string.
    * **Contains:** The URL contains the specified string.
    * **Does not contain:** The URL does not contain the specified string.
    * **Starts with:** The URL starts with the specified string.
    * **Ends with:** The URL ends with the specified string.
    * **Matches regular expression:** The URL matches the specified regular expression.
    * **Does not match regular expression:** The URL does not match the specified regular expression.
    * **Is empty:** The URL is empty.
    * **Is not empty:** The URL is not empty.
* **URL Input Field (B):**
  * In this field, you enter the specific URL or URL pattern that will trigger the event based on the condition type selected from the dropdown menu.

## On Event Trigger

In the Target & Publish page, select the "On Event" trigger to set your experience to launch when a particular event occurs.&#x20;

<figure><img src="/files/ukbHQDsIhv2UDrcWu3JM" alt=""><figcaption></figcaption></figure>

* **Create Event on the Fly**: Quickly create a new event directly from the trigger settings. This allows you to set up new conditions without navigating away from the current setup.
* **Previously Created Event Example**: Choose from events you have previously created. This enables consistent and efficient reuse of events across multiple experiences.

<figure><img src="/files/MJfL0o0RRVFyHGqMLCfk" alt=""><figcaption></figcaption></figure>

**On the Fly Event Parameters**:

* **Add Element Condition**: Specify conditions related to the presence, click, or hover of a particular element.
* **Add Input Condition**: Track events based on user input activities.
* **Add Page Condition**: Trigger the experience when a user visits a specific page or URL.

[^1]: <img src="/files/iTtHACb2aDIdyZniJnVE" alt="" data-size="original">


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.usejimo.com/docs/analyze/success-tracker/events.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
