Ask AI
Skip to main content

Set parameter of template ui element

Function: Set parameter of template ui element​

This action allows you to dynamically change the properties (parameters) of a reusable UI element (often called a "template component") within your application. This is incredibly useful for making your UI elements adaptable and responsive based on user interactions, data changes, or other logic, without needing to create multiple versions of the same component.

Input​

  • UI element (UI element): The specific reusable UI element on your page whose parameter you want to modify. This is a required input.
  • Parameter name (Text): The exact name of the parameter within the selected UI element that you wish to change. For example, if your UI element has a parameter to control its visibility, you might enter "isVisible". This is a required input.
  • Parameter value (Text): The new value you want to assign to the specified parameter. This could be a static text, a number, a true/false value, or a dynamic value derived from other data in your application. If left empty, the parameter's value will be cleared or set to null.

Output​

No direct output is returned by this action. The effect of this action is a change in the specified UI element's parameter, which will then update how that UI element behaves or appears on your page.

Execution Flow​

Real-Life Examples​

Here are some practical ways you can use this action in your no-code application:

Example 1: Changing a button's text based on product availability

Imagine you have a product page where an "Add to Cart" button should change its text if the product is out of stock.

  • Inputs:
    • UI element: ProductDetail_AddToCartButton (This is a reusable button component)
    • Parameter name: buttonLabel
    • Parameter value: \{\{product.inStock ? "Add to Cart" : "Notify Me When Available"\}\} (This value is dynamically set based on the inStock property of your product data)
  • Result: If the product.inStock is true, the button will display "Add to Cart". If it's false, the button will display "Notify Me When Available".

Example 2: Controlling the visibility of a section based on user permissions

You might have an administrative section that should only be visible to users with specific roles.

  • Inputs:
    • UI element: AdminDashboard_SettingsPanel (This is a reusable panel component)
    • Parameter name: isVisible
    • Parameter value: \{\{currentUser.role == "Administrator"\}\} (This value is dynamically set based on the role of the currentUser)
  • Result: The AdminDashboard_SettingsPanel will only appear on the page if the currently logged-in user has the role "Administrator".

Example 3: Updating an image source in a dynamic content block

Consider a content block that displays different images based on the selected category.

  • Inputs:
    • UI element: ContentBlock_HeroImage (This is a reusable image display component)
    • Parameter name: imageSourceUrl
    • Parameter value: \{\{selectedCategory.heroImageUrl\}\} (This value is dynamically set based on the heroImageUrl property of the selectedCategory data)
  • Result: The ContentBlock_HeroImage will display the image URL associated with the currently selectedCategory, making the content block dynamic.