Hi, today i am going to tell you about JSON (JavaScript Object Notation) before start work on json, we should know about JSON and how we use it, a JSON is lightweight data passing format and use to sending data as a web service file, before json, web developer's use XML to send data, a json is very easy to write and readable, now i will show you a basic example on how to passing json data from client side.
JSON Syntax
the json is name/value pairs, json data separated by columns, you can put objects in curly braces and arrays in square brackets
// JSON
"name" : "lessoncup"
// JSON Object
{"name": "lessoncup", "title" : "lessoncup programming blog", "url": "www.lessoncup.com" }
// JSON Array
{
"Lessoncup": [{"name":"lessoncup"}, {"title":"lessoncup programming blog"}, {"url":"www.lessoncup.com"}]
}
Passing JSON data using jQuery
to display the json the using jquery, we use $.getJSON() method this method have three parameters
- url [ string ]
- data [ optional ]
- success [ optional ]
JSON Script
{
"name": "lessoncup",
"title" : "lessoncup programming blog",
"url": "www.lessoncup.com"
}
jQuery Script
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function(){
$('#btn').click(function(){
$.getJSON( "users.json", function( data ) {
var items = [];
$.each(data, function(name,value) {
items.push('<li>'+name+' : '+value+'</li>')
$(".result").html(items);
});
});
});
});
</script>
Live Demo
Hi,
ReplyDeleteI have the below code snippet:
$( document ).ready(function() {
alert("Inside Ready");
var url = "url";
$.getJSON(url, function(data) {
alert("I am here");
//do stuff
});
});
url is checked. no issue with url. getting alert "Inside Ready" but control is not going inside getJSON hence not getting alert "I am here".
Any idea what might be causing the issue? Need help!
It should work. Do you have any jsfiddle?
ReplyDelete