alpinejs-form-data
v1.0.4
Published
Get the data from the form in a key/value pair of name and value 🥯
Downloads
655
Maintainers
Readme
Alpine JS Form Data
Get the data from the form in a key/value pair of name and value 🥯
Install
With a CDN
<script
defer
src="https://unpkg.com/alpinejs-form-data@latest/dist/form-data.min.js"
></script>
<script defer src="https://unpkg.com/[email protected]/dist/cdn.min.js"></script>
With a Package Manager
yarn add -D alpinejs-form-data
npm install -D alpinejs-form-data
import Alpine from 'alpinejs'
import formData from 'alpinejs-form-data'
Alpine.plugin(formData)
Alpine.start()
Example
<form x-data x-on:submit.prevent="console.log($formData)">
<input type="text" name="title" />
<input type="text" name="slug" />
<button>Submit</button>
</form>
On submit this will return the following:
{title: 'My New Blog Post', slug: 'my-new-blog-post'}
Returning Data as Array
You may want the data returned to be a nested array:
[
['title', 'My New Blog Post'],
['slug', 'my-new-blog-post'],
]
To do this you can use $formDataArray
instead of $formData
.
Stats