LiveView Tips and Tricks

hooks.js

/*
* Resets a input to a value when a form is updated by LiveView.
* Add phx-hook="FormReset" to the form and phx-reset="" to the input you want to reset.
* The attribute phx-reset must contain the value that the input value will be reseted to.
*/
Hooks.FormReset = {
  updated() {
    let input = this.el.querySelector('[phx-reset]:not(.invalid-feedback)')
    let value = input.getAttribute('phx-reset')
    input.value = value
  }
}