https://github.com/formspark/formson
FormData to JSON converter
https://github.com/formspark/formson
Last synced: 4 months ago
JSON representation
FormData to JSON converter
- Host: GitHub
- URL: https://github.com/formspark/formson
- Owner: formspark
- License: mit
- Created: 2024-09-06T10:05:35.000Z (almost 2 years ago)
- Default Branch: master
- Last Pushed: 2024-09-06T14:49:47.000Z (almost 2 years ago)
- Last Synced: 2025-10-27T06:28:09.919Z (8 months ago)
- Language: TypeScript
- Size: 38.1 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Formson
Formson is a FormData to JSON converter.
It supports:
- Dot notation to create nestable objects
- Square bracket notation to create arrays
- Mixed object/array structures
Sponsored by Formspark, the simple & powerful form solution for developers.
## Installation
Add the Formson script.
```html
```
You can now use the `Formson.toJSON` function to convert a FormData object to a JSON object.
```javascript
const json = Formson.toJSON(formData);
```
## Examples
### Basic example
```html
Example
Submit
document
.getElementById("form")
.addEventListener("submit", function (event) {
event.preventDefault();
const formData = new FormData(this);
const json = Formson.toJSON(formData);
alert(JSON.stringify(json));
});
```
### Dot notation
Dot notation uses periods (`.`) to create nested objects.
```html
```
This will result in the following JSON structure:
```json
{
"user": {
"firstName": "John",
"lastName": "Doe"
}
}
```
### Square bracket notation
Square bracket notation uses square brackets (`[]`) to create arrays.
```html
```
This will result in the following JSON structure:
```json
{
"users": ["Alice", "Bob", "Charlie"]
}
```
### Complex structure
You can mix dot and square bracket notation to create complex structures.
```html
Submit
```
This will result in the following JSON structure:
```json
{
"user": {
"name": "John Doe",
"skills": ["JavaScript", "TypeScript"],
"address": {
"street": "123 Main St",
"city": "Anytown"
},
"projects": [
{
"name": "Project A",
"tasks": ["Task 1", "Task 2"]
},
{
"name": "Project B",
"tasks": ["Task 3"]
}
]
}
}
```
## License
[MIT](https://opensource.org/licenses/MIT)