Auto-submit form when a field value is changed
Learn how to submit a form when anything is changed.
We can auto submit our form when anything is changed using @submit event. We added a debounce function to only submit the form 1 second after the last change to avoid too many requests:
vue
<template>
<Vueform @change="handleChange" />
</template>
<script setup>
import { ref } from 'vue'
let timer = ref(null)
const handleChange = (newValue, oldValue, form$) => {
debounce(form$.submit, 1000)()
}
const debounce = (func, timeout = 300) =>{
return (...args) => {
clearTimeout(timer.value)
timer.value = setTimeout(() => {
func.apply(this, args)
}, timeout)
}
}
<script>
