The jQuery Get() ajax method supports HTML, XML,
JSON and Text type responses sent by the server. In this post we shall see on
how to process JSON data returned from the server using the jQuery Get()
method.
.aspx Page (Client Side)
The syntax for receiving and
processing JSON response is as follows.
$.get("<Server URL>", successHandlerFunction(…));
The following example receives a JSON format data from the server and displays the data in a DIV tag in the browser.
$.get("<Server URL>", successHandlerFunction(…));
The following example receives a JSON format data from the server and displays the data in a DIV tag in the browser.
.aspx Page (Client Side)
<html xmlns="http://www.w3.org/1999/xhtml"
>
<head runat="server">
<title>jQuery
Ajax Load</title>
<script type="text/javascript" src="JavaScript/jquery-1.7.2.js"></script>
<script
type="text/javascript"
language="javascript">
$(document).ready(function() {
// Get
JSON Response data from the Server
$('#btnGetJSON').click(function(event) {
event.preventDefault();
var
jsonContent = "";
var
jsonObj;
$.get("AjaxData.json", function(result) {
jsonObj =
jQuery.parseJSON(result);
for
(var x = 0; x < jsonObj.length; x++) {
jsonContent +=
jsonObj[x].Name;
jsonContent += "-";
jsonContent +=
jsonObj[x].Age;
jsonContent += "<br>";
}
$("#divJSON").html(jsonContent);
}
);
});
});
});
</script>
</head>
<body>
<form id="frmAjax" runat="server">
<table border="1">
<tr>
<td><b>Action</b></td>
<td><b>Response</b></td>
</tr>
<tr valign="middle">
<td>
<asp:Button
ID="btnGetJSON"
runat="server"
Text="Get JSON" />
</td>
<td align="center">
<br /><div id="divJSON"></div>
</td>
</tr>
</table>
</form>
</body>
</html>
.AjaxData.json(Server
Side)
[{"Name": "John", "Age": "34"}, {"Name": "David", "Age":"24"}]
Related Post
jQuery Get Method
jQuery Get HTML Response Example
jQuery Get XML Response Example
jQuery Get Text Response Example
jQuery Get JSON Response Example
jQuery HTTP GET Request Example
[{"Name": "John", "Age": "34"}, {"Name": "David", "Age":"24"}]
Related Post
jQuery Get Method
jQuery Get HTML Response Example
jQuery Get XML Response Example
jQuery Get Text Response Example
jQuery Get JSON Response Example
jQuery HTTP GET Request Example
No comments:
Post a Comment