Showing posts with label jQuery Ajax. Show all posts
Showing posts with label jQuery Ajax. Show all posts

Tuesday, November 20, 2012

jQuery ajax getScript Method

jQuery ajax getScript Method

jQuery ajax Post Method

jQuery ajax getJSON Method

jQuery ajax getJSON Method

jQuery ajax Get Method

jQuery ajax Method

jQuery Ajax Properties

jQuery Ajax Handlers

jQuery Ajax Overview

jQuery Ajax Overview


Wednesday, November 14, 2012

jQuery getScript Method

jQuery provides various methods like ajax, load, get, post, getJSON, getJSON etc  to make an Ajax call. In this post we shall see on how to use the getScript() method to make an Ajax call.

The getScript() method is used to receive and process JavaScript data response from the server.  The Syntax for the getScript() method is as follows.
$.getScript("<server URL>");

The script which is returned from the server is directly executed in the browser.


Related Post
jQuery getJSON Method
jQuery getJSON Example
jQuery getScript Method
jQuery getScript Example

jQuery getScript Example

jQuery provides various methods like ajax, load, get, post, getJSON, getJSON etc  to make an Ajax call. In this post we shall see on how to use the getScript() method to make an Ajax call.

The following example receives a getScript data from the server and executed it in the browser

.aspx Page (Client Side)
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>jQuery Ajax getJSON</title>
    <script type="text/javascript" src="JavaScript/jquery-1.7.2.js"></script>
    <script
        type="text/javascript"
        language="javascript">
        $(document).ready(function() {
            // Get Script Response data from the Server
            $('#btnGetScript').click(function(event) {
                event.preventDefault();
                $.getScript("AjaxData.js");
            });
        });
    </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="btnGetScript"
                        runat="server"
                        Text="Get Script" />
                </td>
            </tr>
    </table>
    </form>
</body>
</html>

.AjaxData.js(Server Side)

alert("Hi, i am from the Server");

Related Post
jQuery getJSON Method
jQuery getJSON Example
jQuery getScript Method
jQuery getScript Example

jQuery getJSON Example

jQuery provides various methods like ajax, load, get, post, getJSON, getJSON etc  to make an Ajax call. In this post we shall see on how to use the getJSON () method to make an Ajax call.

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 getJSON</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;
                $.getJSON("AjaxData.json", function(result) {
                    for (var x = 0; x < result.length; x++) {
                        jsonContent += result[x].Name;
                        jsonContent += "-";
                        jsonContent += result[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 getJSON Method
jQuery getJSON Example
jQuery getScript Method
jQuery getScript Example


jQuery getJSON Method

jQuery provides various methods like ajax, load, get, post, getJSON, getJSON etc  to make an Ajax call. In this post we shall see on how to use the getJSON () method to make an Ajax call.

The
getJSON() method is used to process JSON data response from the server.  

The Syntax for the getJSON() method is as follows.

Thursday, November 8, 2012

jQuery Post Method

jQuery provides various methods like ajax, load, get, post, getJSON, getJSON etc  to make an Ajax call. In this post we shall see on how to use the post() method to make an Ajax call.

The post() method is used to send HTTP POST requests to the server, this method can process the response data from the server in any of the following formats.

HTML
XML
JSON
Text

 The Syntax for the post() method is as follows.


$.post("<server URL>",<POST parameters>, successHandlerFunction());

Friday, November 2, 2012

jQuery Get Method

jQuery provides various methods like ajax, load, get, post, getJSON, getJSON etc  to make an Ajax call. In this post we shall see on how to use the get() method to make an Ajax call.

The get() method is used to send HTTP GET requests to the server, this method can process the response data from the server in any of the following formats.

HTML
XML
JSON
Text

The Syntax for the get() method is as follows.

$.get("<server page>",successHandlerFunction());

Tuesday, October 30, 2012

jQuery Ajax Method

jQuery provides various methods like ajax, load, get, post, getJSON, getJSON etc  to make an Ajax call. In this post we shall see on how to use the Ajax() method to make an Ajax call.

The Ajax() method is core method used to perform ajax calls using jQuery, The ajax method supports GET & POST requests, it also supports the server data returned in the following formats.

HTML
XML
Text
JSON
Script

The Syntax for the Ajax() method is as follows.
$.ajax({
    url: "",     
   
 type: 'GET/POST',
    data: {},
   
 cache: <true/false>,
   
 dataType: "text/xml/html/json",
   
 success: function(result) {…});
   
 }
});

Related Post
jquery ajax method
jquery ajax get example
jquery ajax post example
jquery ajax html response example
jquery ajax xml response example
jquery ajax json response example
jquery ajax text response example

Monday, October 22, 2012

jQuery Ajax JSON Response Example

jQuery supports different types of responses data types which are sent by the server as a result of processing Ajax request, the various types of data supported are HTML, XML, JSON and Text. In this post we shall see on how to process JSON data returned from the server using jQuery.
The syntax for receiving and processing JSON response is as follows.

$.ajax({
    url: "AjaxData.json",
    cache: true,
    dataType: "json",
    success: function(result) {…}
});

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</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 = "";
                $.ajax({
                    url: "AjaxData.json",
                    cache: false,
                    dataType: "json",
                    success: function(result) {
                        for (var x = 0; x < result.length; x++) {
                            jsonContent += result[x].Name;
                            jsonContent += "-";
                            jsonContent += result[x].Age;
                            jsonContent += "";                        }
                        $("#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>
            <td>
                <asp:Button
                    ID="btnGetJSON"
                    runat="server"
                    Text="Get JSON"/>
            </td>
            <td>
                <div id="divJSON"></div> 
            </td>
        </tr> 
    </table>
    </form>
</body>
</html>

AjaxData.json (Server side)
[{"Name": "John", "Age": "34"}, {"Name": "David", "Age":"24"}]

Run the Application and click on the btnGetJSON button, notice that the request is processed and the JSON data sent by the server is parsed and displayed in the Browser.