# Reading query params from URL

This navigation use case focuses on how you can pass and read query params from the URL. Let's say you have a *Table* component and *on row select* you want users to be transferred to the *Details* page of a specific record. This can be achieved using the **Navigation** action step. 

Check out the instruction below:point\_down:

1. First, navigate to the **Pages** tab in the left side panel and create a new page (we'll name it *Customer* since it will display customer details).
2. Select your *Table* component and navigate to the **Triggers** section.
3. For the *On Row Select* trigger, click **Create action** to create a new action navigating to the *Customer* page.
4. Select the **Navigate** action step and set the destination page as `{{routes.customer.url}}`.
5. Next, in the **Query params** specify the following:\
   `id = {{ui.customersTable.selectedRow.data.customer_id}}`.
6. Now, go back to the *Customer* page and add a **Detail** component there to display the data of a selected record from the table.
7. Create a new action of the **Load Row** type for your current Table.
8. In the *Filters* section, for *customer\_id* specify the following variable to receive the **URL query parameter** on the child page:

   `{{activeRoute.queryParams.id}}`
9. Assign the *Load Row* action to the **Detail** component.

That's it! Now, when selecting a row in the Table, you'll immediately navigate to the child page with the selected customer displayed.

{% hint style="info" %}
This option can be also useful when creating a redirect after a form submit.
{% endhint %}

{% @arcade/embed flowId="L7qBNzNLI8RR0Xky1CMD" url="<https://app.arcade.software/share/L7qBNzNLI8RR0Xky1CMD>" %}


---

# 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://docs.uibakery.io/how-tos/layout-and-navigation/read-query-params-from-url.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.