Wized Docs

Appearance

Navigation ​

The navigation data is located under the n keyword and stores the current navigation state. It can be accessed in the Function Editor.

Location ​

The n.href and n.path fields store the current location data. They are updated whenever the URL changes.

  • n.href stores the full URL, including the protocol, domain, port, and query parameters. Example: https://example.com/path?query=param.
  • n.path stores the path of the URL, without the protocol, domain, port, and query parameters. Example: /path.

These variables are automatically updated whenever the user navigates to a different page:

Query parameters ​

Query parameters are stored in the n.parameter field. It is an object that contains all the query parameters that Wized must keep track of.

INFO

If a query parameter is not defined in the Data Store, it will not be tracked by Wized.

You can create a new query parameter by clicking the + button in the Navigation section of the Data Store. Once defined, Wized will automatically populate the n.parameter object with the query parameter's value, if it is present in the URL.

Example ​

If you create a query parameter named id, Wized will automatically populate n.parameter.id with the value if present in the URL. So, visiting:

https://example.com/path?id=1

will result in n.parameter.id being equal to 1.

To test query parameters, you can configure the Canvas to include any parameter in the current page:

Updating the navigation data ​

To update the user's location, you can either use the Navigate to action or use custom JavaScript.

Updating the navigation data using JavaScript ​

WARNING

This is an advanced feature and should only be used if you know what you're doing.

All navigation data can be updated using custom JavaScript instead of relying on the Navigate To action. Any changes made to the navigation data using JavaScript will trigger an update of the current URL.

The following will happen when the navigation data is updated:

  • n.href: when updated, the browser will navigate to the new URL.
  • n.path: when updated, the browser will navigate to the new URL, but will keep the query parameters.
  • n.parameter.parameter_name: when updated, the browser will update the query parameter in the URL.
Updating the navigation data inside the Function Editor

To update the navigation data inside the Function Editor, you can simply assign a new value to it:

js
(c, f, i, n, r, v, e, t) => {
  n.path = '/success'; 
};
Updating the navigation data via the JavaScript API

The navigation data can also be updated via the JavaScript API:

js
Wized.data.n.parameter.page = '2';