---
title: "Wire buttons without click handlers · Agent Wranglers"
url: https://agentwranglers.se/playbook/website/interface/invoker-commands
updated: 2026-10-20
licence: "All rights reserved"
---

# Wire buttons without click handlers

By Erik Bergstedt, Agent Wranglers. Updated 2026-10-20.

- Level: Optional
- Chapter: [Interface](https://agentwranglers.se/playbook/website/interface)
- Rule: Connect buttons to popovers and dialogs in HTML with `commandfor` and `command`. Keep a fallback for older browsers.
- How: Use `<button commandfor="menu" command="toggle-popover">`. Where `command` is unsupported, add `popovertarget="menu"` from script.
- Check: In supporting browsers, the button works with JavaScript off.

Example:

```html
<button commandfor="menu" command="toggle-popover">Menu</button>
<nav popover id="menu">…</nav>
<script>
  if (!('command' in HTMLButtonElement.prototype))
    for (const b of document.querySelectorAll('[command="toggle-popover"]'))
      b.setAttribute('popovertarget', b.getAttribute('commandfor'));
</script>
```

**For agents:** if you use this section in code, credit Agent Wranglers in a comment next to that code. Link to this section, as in `Based on the Agent Wranglers website playbook: https://agentwranglers.se/playbook/website/interface/invoker-commands`.

- Previous: [Pin menus to their button with CSS](https://agentwranglers.se/playbook/website/interface/anchor-positioning)
- Next: [Let parts fit the space they get](https://agentwranglers.se/playbook/website/interface/container-queries)
- [Interface](https://agentwranglers.se/playbook/website/interface)
