Forms

Number input

<input
    type="text" <!-- or keep type="number" and hide the arrow with CSS -->
    inputmode="numeric" <!-- shows the 9 digit grid -->
    pattern="[0-9]+" <!-- typing non-digits won't do a/th in Chrome -->
    >

Type validation with TS and zod

FormData API

Bytes #174 - Putting the "p" in npm

<form>
  <input type="text" name="name" />
  <input type="number" name="number" />
  <input type="date" name="date" />
  <button type="submit">Submit</button>
</form>

  const form = $('form')
  form.addEventListener('submit', (e) => {
    e.preventDefault()
    const formData = new FormData(form)
    const date: string = formData.get('date')
    const number = formData.get('number')
    // ...
  })

Getting right type from the input value

const num: number = $('input[type="number"]').valueAsNumber

const date: Date = $('input[type="date"]').valueAsDate

---

Last update: 2023-04-24