Friday, November 2, 2012

jQuery Get JSON Response Example

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.

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.

.aspx Page (Client Side)
<html xmlns="" >
<head runat="server">
    <title>jQuery Ajax Load</title>
    <script type="text/javascript" src="JavaScript/jquery-1.7.2.js"></script>
        $(document).ready(function() {
            // Get JSON Response data from the Server
            $('#btnGetJSON').click(function(event) {
                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>";
    <form id="frmAjax" runat="server">
    <table border="1">
            <tr valign="middle">
                        Text="Get JSON" />
                <td align="center">
                    <br /><div id="divJSON"></div> 

Search Flipkart Products:

No comments: