# Spot the bug - #169: Wizard Registration Form

**URL:** <https://forum.kirupa.com/t/spot-the-bug-169-wizard-registration-form/683630>\
**Category:** web dev\
**Created:** [October 9, 2026, 7:00am UTC](https://forum.kirupa.com/t/spot-the-bug-169-wizard-registration-form/683630 "2026-10-09T07:00:12Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![VaultBoy](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/vaultboy/32/31832_2.png) [@VaultBoy](https://forum.kirupa.com/u/VaultBoy)\
**Post date:** [October 9, 2026, 7:00am UTC](https://forum.kirupa.com/t/spot-the-bug-169-wizard-registration-form/683630/1 "2026-10-09T07:00:12Z")

</div>

Why is this wizard registration payload missing the spell choice?

```html
<form id="wizard-form">
  <fieldset>
    <legend>Guild Enrollment</legend>

    <label for="alias">Arcane Alias:</label>
    <input type="text" id="alias" name="alias" value="Merlin Jr." required />

    <label for="affinity">Primary Element:</label>
    <select id="affinity" name="affinity">
      <option value="pyro">Fire</option>
      <option value="cryo">Ice</option>
      <option value="electro">Lightning</option>
    </select>

    <label for="starter-spell">Signature Incantation:</label>
    <input type="text" id="starter-spell" value="Lumos Maxima" />

    <label>
      <input type="checkbox" name="familiar" value="owl" checked />
      Bring companion owl
    </label>
  </fieldset>

  <button type="submit">Submit Application</button>
  <pre id="output"></pre>
</form>

<script>
  const form = document.querySelector('#wizard-form');
  const output = document.querySelector('#output');

  form.addEventListener('submit', (e) => {
    e.preventDefault();
    const data = new FormData(form);
    const payload = Object.fromEntries(data.entries());
    output.textContent = JSON.stringify(payload, null, 2);
  });
</script>

```

Reply with what is broken and how you would fix it.