Buttons can be made interactive by attaching JavaScript event handlers to
them. This allows you to define custom behavior when a user interacts with
the button, such as clicking it. Just as with any other component, you can
use the attrs paramerter of the button component
to specify event types and their corresponding JavaScript code(attrs={"onclick": "..."})
or you can use on shortcut(on={"click": "..."}).
Using inline JS is not recommended and it's better to attache listeners to elements using data-modules or CSS selectors.
{%- call ui.util.call(show_example) -%} {%- raw %} {{ ui.button("Show alert", on={"click": "alert('CLICK')"}) }} {% set id = ui.util.id() %} {{ ui.button("Reload the page", attrs={"id": id}) }} {%- endraw %} {%- endcall %}