https://github.com/singhtal/formtojson

https://github.com/singhtal/formtojson

Last synced: 3 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/singhtal/formtojson
• Owner: singhtal
• License: mit
• Created: 2022-02-20T12:37:40.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2022-02-20T17:48:38.000Z (almost 3 years ago)
• Last Synced: 2024-10-11T12:55:40.256Z (3 months ago)
• Language: JavaScript
• Size: 3.91 KB
• Stars: 4
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
Lighest Form to JSON data plugin ⚡⚡

## Usage

 Install the plugin 

```Bash

npm i react-form2json

```

### Using plugin in react code

```javascript

import formtojson from "react-form2json";

```

#### Pass event as a parameter

formtojson takes submit event as a paramter, event is e in this case.

```javascript

    const data = formtojson(e);

    console.log(data);

```

#### React Example

```javascript

import React, { useState } from "react";

import formtojson from "react-form2json";

function Myform() {

  const [name, setName] = useState("Talvinder");

  const [age, setAge] = useState("20");

  const handleClick = (e) => {

    const data = formtojson(e);

    console.log(data);

  };

  const handleName = (e) => {

    setName(e.target.value);

  };

  const handleAge = (e) => {

    setAge(e.target.value);

  };

  return (

    


       handleClick(e)}>

         handleName(e)}

        />

         handleAge(e)}

        />

        Submit

      

    

  );

}

export default Myform;


```

On Form Submit the output will be -

```bash

{"name":"Talvinder","age":"20"}

```