In this post, I would like to show you creating a JSON file and appending content to it whenever somebody submits a form. For this tutorial, I am gonna use Laravel 5.6 version.
Let’s create a brand new Laravel project via Composer Create-Project command. lets issue following command from your terminal:
|
1 |
composer create-project --prefer-dist laravel/laravel jsonAppendDemo |
It will create a directory called jsonAppendDemo and download all the Laravel project files and its dependencies.
After completing setup process, create a view file called contact_form.blade.php in resources/views directory with following HTML.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
<form id="product-form" action="{{url('/contact/store')}}" method="POST"> {{ csrf_field() }} <div class="form-group"> <label for="product">Name</label> <input type="text" class="form-control" id="name" name="name" placeholder="Enter Full Name"> </div> <div class="form-group"> <label for="product">Email</label> <input type="text" class="form-control" id="email" name="email" placeholder="Enter Email"> </div> <div class="form-group"> <label for="product">Subject</label> <input type="text" class="form-control" id="subject" name="subject" placeholder="Enter Subject"> </div> <div class="form-group"> <label for="product">Message</label> <textarea class="form-control" rows="5" id="message" name="message" name="message"></textarea> </div> <div class="form-group"> <input class="btn btn-lg btn-primary" id="submit" type="submit" value="Save" name="submit" /> </div> </form> |
Create a controller called ContactController.php with below command:
|
1 |
$ php artisan make:controller ContactController |
After creating controller lets define following methods, index is to show the contact form and store method is to handle the submitted data.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
function index() { return view('contact_form'); } function store(Request $request) { try { // my data storage location is project_root/storage/app/data.json file. $contactInfo = Storage::disk('local')->exists('data.json') ? json_decode(Storage::disk('local')->get('data.json')) : []; $inputData = $request->only(['name', 'email', 'message','subject']); $inputData['datetime_submitted'] = date('Y-m-d H:i:s'); array_push($contactInfo,$inputData); Storage::disk('local')->put('data.json', json_encode($contactInfo)); return $inputData; } catch(Exception $e) { return ['error' => true, 'message' => $e->getMessage()]; } } |
All set lets define routes to access the form and to process the submitted data in your web.php route file.
|
1 2 |
Now start the php server with below command
|
1 |
$ php artisan serve |
Once it is started, if you visiting http://localhost:8000, you should see the following page in your browser
Once you submit the form data will be stored in the project_root/storage/app/data.json file.
Here is my data.json file.
|
1 |
[{"name":null,"email":null,"message":null,"datetime_submitted":"2018-05-02 01:36:30"},{"name":"Arjun","email":"[email protected]","message":"Hey there!","datetime_submitted":"2018-05-02 01:37:10"}] |
I hope you like this Post, Please feel free to comment below, your suggestion and problems if you face - we are here to solve your problems.