How to send data of HTML form directly to JSON file?

01 Aug, 2021
The task is to send data of HTML form directly to JSON file.
Approach: We have an HTML form containing several fields such as name, college, etc. We want to send the data of our HTML form directly to the JSON file. For this we are using json_encode() function which returns a JSON encoded string.
We are making an array of values that the user fills in the HTML form. Then we pass this array into json_encode() function. Then json_encode() function returns a JSON encoded string. The whole task is implemented in a PHP function get_data(). To create a JSON file we used PHP function file_put_contents(). This function is used to write data to a file. We pass 2 arguments in file_put_contents() function. The first parameter is our file name in which we want to store data in the JSON format and second is our get_data() function.
Example: The following HTML and PHP codes demonstrates the above approach.
<html>  <head>    <meta charset="UTF-8">      <style>        h3 {            text-align: center;        }          img {            display: block;            margin: auto;            height: 150px;            width: 150px;        }          .input {            margin: 6px;            padding: 10px;            display: block;            margin: auto;            color: palevioletred;            font-size: 30px;        }          input {            width: 90%;            display: block;            margin-left: 12px;            background: none;            background-color: lightyellow;        }          select {            width: 90%;            display: block;            margin-left: 12px;            background: none;            background-color: lightyellow;        }          #heading {            font-family: cursive;            text-align: center;            color: green;            padding-top: 20px;          }          #form_page {            height: 500px;            width: 50%;            display: flex;            flex-wrap: wrap;            flex-direction: row;            margin: auto;          }          #form_body {            border-radius: 12px;            height: 330px;            width: 450px;            background-color: beige;            border: 1px solid pink;            margin: auto;            margin-top: 12px;        }          #text {            color: red;            width: 100px;        }          #head {            border-bottom: 2px solid red;            height: 100px;            background-color: aliceblue;        }          #submit {            background-color: white;            width: 70px;        }    </style>  </head>  <body>      <form method="post" action="gfg.php">          <div id="form_page">              <div id="form_body">                <div id="head">                    <h1 id="heading">GFG</h1>                </div>                <br />                <div id="input_name" class="input">                    <input id="name" type="text"                         Placeholder="Name" name="name"                         required>                </div>                <div id="input_class" class="input">                    <input type="text" placeholder=                        "Branch" name="branch" required>                </div>                <div id="input_year" class="input">                    <input id="school" type="text"                         name="college"                         placeholder="College">                </div>                  <div class="id input">                    <input id="submit" type="submit"                         name="submit" value="submit"                         onclick="on_submit()">                </div>            </div>        </div>    </form>  </body>  </html>
gfg.php This “gfg.php” file demonstrates the PHP code to which the HTML form contents are posted.
<?php        if ($_SERVER['REQUEST_METHOD'] == 'POST') {                  function get_data() {            $datae = array();            $datae[] = array(                'Name' => $_POST['name'],                'Branch' => $_POST['branch'],                'College' => $_POST['college'],            );            return json_encode($datae);        }                  $name = "gfg";        $file_name = $name . '.json';               if(file_put_contents(            "$file_name", get_data())) {                echo $file_name .' file created';            }        else {            echo 'There is some error';        }    }?>
Output: The content of “gfg.json” file shows the following data in JSON format.
PHP is a server-side scripting language designed specifically for web development. You can learn PHP from the ground up by following this PHP Tutorial and PHP Examples.
HTML-Misc
PHP-Misc
HTML
PHP
PHP Programs
Web Technologies
HTML
PHP
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
How to update Node.js and NPM to next version ?
REST API (Introduction)
CSS to put icon inside an input element in a form
Types of CSS (Cascading Style Sheet)
HTTP headers | Content-Type
How to execute PHP code using command line ?
PHP in_array() Function
How to delete an array element based on key in PHP?
How to Insert Form Data into Database using PHP ?
How to convert array to string in PHP ?