In this article we will understand how we can read JSON data from a external file.JSON is short for JavaScript Object Notation, and is a way to store information in an organized, easy-to-access manner .One of the easiest ways to load JSON data into our web applications is to use jQuery.getJSON().For this we have to understand the term “jQuery.getJSON()” .
So what is significance of jquery.getJSON?????….
jQuery.getJSON()
It loads JSON data from the server using GET HTTP request .
Now to understand how to use the getJSON function to read json data we will make a sample project
- Create a new project in Visual Studio .
- Add new item -> HTML page .
- Create a new JSON file and add it to your project.
- So here, we use a for statement and created a variable called output to temporarily store the data.
- Once we go through all of the elements in the array, we use the output variable to populate the placeholder div.
<html> <head> <title></title> </head> <body> <div id="placeholder"></div> <script src="http://code.jquery.com/jquery-1.7.1.js"></script> <script> $.getJSON('data.json', function(data){ var output = "<ul>"; for (var i in data.users) { output += "<li>" + data.users[i].EmployeeID + " " + data.users[i].Name + " " + data.users[i].Joining.month + "</li>" } output += "</ul>"; document.getElementById("placeholder").innerHTML = output; }); </script> </body> </html>
Happy Coding !!
