---
title: "Working with JSON Files"
description: "In this blog, I’ explain how to use and create json files. A common use of JSON is to read data from a web server, and display the data in a web page."
author: "Anchal Kesharwani"
published: 2014-10-01
updated: 2014-10-01
canonical: https://www.mindstick.com/blog/696/working-with-json-files
category: "json"
tags: ["json"]
reading_time: 3 minutes
---
# Working with JSON Files
In this blog, I’ explain how to use and create json files.
A common use of JSON is to read data from a [web server](https://www.mindstick.com/articles/23199/digital-personal-server-the-premium-web-server), and display the data in a [web page](https://www.mindstick.com/forum/718/sql-server-report-alignment-to-center-of-web-page).
Create an example to read [JSON data](https://www.mindstick.com/forum/782/how-to-send-request-amp-amp-response-from-json-data-using-asp-dot-net) from the [js file](https://www.mindstick.com/forum/12680/call-custom-js-function-inside-jquery-ajax-that-is-defined-in-an-external-js-file).
```
JSON Files Example JSON Files Example
```
Here we need to this example explained. In the above example use the Employee.js file that show the employee name and [profession](https://yourviews.mindstick.com/view/87868/how-has-blogging-become-a-profession-in-the-world) as list.
##### 1. Create Array of object
Use an array object for storing the data. In this array all contain two information that is name and profession of employee.
```
[ { "name": "Amit Patel", "profession": "Software Engineer" }, { "name": "Satish Kumar", "profession": "Software Engineer" }, { "name": "Dev Shukla", "profession": "Web Developer" }]
```
2. Display the Employee List
Create a [javascript function](https://www.mindstick.com/forum/2090/send-data-from-asp-dot-net-code-behind-to-a-javascript-function) that shows the array list as an employee’s in the div name and profession.
```
function employeeList(arr) { var names = "Name
"; var professions = "Profession
"; var i; for (i = 0; i < arr.length; i++) { names += arr[i].name+"
"; professions += arr[i].profession + "
"; } document.getElementById("name").innerHTML = names; document.getElementById("profession").innerHTML = professions; }
```
##### Call employeeList() with textArray:
```
employeeList(textArray);
```
3. Use the array as argument
Call the employeeList() function to get the list of an employee [as an argument](https://answers.mindstick.com/qa/31668/in-c-if-you-pass-an-array-as-an-argument-to-a-function-what-actually-gets-passed):
```
employeeList([ { "name": "Amit Patel", "profession": "Software Engineer" }, { "name": "Satish Kumar", "profession": "Software Engineer" }, { "name": "Dev Shukla", "profession": "Web Developer" }]);
```
##### 4. Put this function in JS file
##### This code put in a js file named as Employee.js as like this:
##### ##### Employee.js
```
employeeList([ { "name": "Amit Patel", "profession": "Software Engineer" }, { "name": "Satish Kumar", "profession": "Software Engineer" }, { "name": "Dev Shukla", "profession": "Web Developer" }]);
```
##### 5. Add js file in your program
##### \
This Employee.js file add in the program by the script tag like as:
```
```
Script add Employee.js [file in your](https://www.mindstick.com/forum/156583/best-way-to-link-bootstrap-file-in-your-project) program that contain employee dat.
I hope that this blog is helpful for you. Thanks!
---
Original Source: https://www.mindstick.com/blog/696/working-with-json-files
Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.