Scribd Logo
Upload

Welcome to Scribd!

  • 41 views

    AJAX Using Jquery and ASP

    Uploaded by

    theanhcb
    The document discusses how to use jQuery to make AJAX calls to ASP.NET page methods without using the ScriptManager. It provides an example using jQuery's AJAX method to call a GetData page method in C# codebehind, which returns the current server time. On page load, a click handler is attached to a div to make the AJAX call when clicked. The success callback updates the div with the response. Using Google's AJAX CDN to host jQuery is also suggested for improved performance.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content

    You might also like

    AJAX Using Jquery and ASP

    Uploaded by

    theanhcb
    41 views4 pages
    The document discusses how to use jQuery to make AJAX calls to ASP.NET page methods without using the ScriptManager. It provides an example using jQuery's AJAX method to call a GetData page method in C# codebehind, which returns the current server time. On page load, a click handler is attached to a div to make the AJAX call when clicked. The success callback updates the div with the response. Using Google's AJAX CDN to host jQuery is also suggested for improved performance.

    Original Description:

    Original Title

    AJAX using jquery and ASP

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The document discusses how to use jQuery to make AJAX calls to ASP.NET page methods without using the ScriptManager. It provides an example using jQuery's AJAX method to call a GetData page method in C# codebehind, which returns the current server time. On page load, a click handler is attached to a div to make the AJAX call when clicked. The success callback updates the div with the response. Using Google's AJAX CDN to host jQuery is also suggested for improved performance.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    41 views4 pages

    AJAX Using Jquery and ASP

    Uploaded by

    theanhcb
    The document discusses how to use jQuery to make AJAX calls to ASP.NET page methods without using the ScriptManager. It provides an example using jQuery's AJAX method to call a GetData page method in C# codebehind, which returns the current server time. On page load, a click handler is attached to a div to make the AJAX call when clicked. The success callback updates the div with the response. Using Google's AJAX CDN to host jQuery is also suggested for improved performance.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    of 4

    AJAX using jquery and ASP.

    NET
    by Farooq Kaiser 7. February 2009 04:14

    jQuery is a lightweight JavaScript library and can be downloaded from http://www.jquery.com. 

    I’ll show you how to use jQuery to call a page method without using the ScriptManager. 

    This will be our page method in ASP.NET code behind. 
    public partial class _Default : Page 
    {
      [WebMethod]
      public static string GetData()
      {
        return String.Format("Sever time is..{0}", DateTime.Now.ToString());
      } 
    } 

     Here is our Default.aspx

    <html>
    <head>
      <title>Demo with jQuery</title>
      <script type="text/javascript" src="jquery-1.2.6.min.js"></script>
      <script type="text/javascript" src="Demo.js"></script>
    </head>
    <body>
      <div id="divResult">Click here to get server time</div>
    </body> 
    </html> 

    You can increase the performance by replacing above Script with google AJAX Libraries.

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.j
    s"></script>

     Google AJAX Libraries can be found here http://code.google.com/apis/ajaxlibs/ 

    Here is our Demo.js

    $(document).ready(function() {
      $("#divResult").click(function() {
        $.ajax({
          type: "POST",
          url: "Default.aspx/GetData",
          data: "{}",
          contentType: "application/json; charset=utf-8",
          dataType: "json",
          success: function(res) {
            $("#divResult").text(res.d);
          }
    });
    });
     }); 

    Currently rated 4.0 by 2 people

     Currently 4/5 Stars.


     1
     2
     3
     4
     5

    How to use jquery ajax in asp dot net web


    page
    Wednesday, December 22, 2010

    Categories: ASP.NET, Javascript/JQuery

     Jquery is a very powerful tool that extends the javascript library, and there are quite a few
    methods with in jquery that makes it much easier to work with ajax. Lets take a look at an
    example.

     Here is a real world example of using jquery ajax with asp.net

     Here is the html code to get a Parcel page shipping date. Note this can be easily
    modified to call any asp.net code behind function or method from jQuery.
     <html>
    <head>
    <title>Call Page Method with Jquery Ajax</title>
    <script type="text/javascript" src="jquery.js"></script>
    //add the below jquery code here
    </head>
    <body>
    <div id="Result">
    <input type="text" id="txtTrackingNumber" />
    <input type="button" id="btnSubmit" value="Search Parcel" />
    <div id="ParcelShippingDate"></div>
    </div>
    </body>
    </html>

      

     Here is the jQuery code to make it all work...


     <script type="text/javascript">
    $(document).ready(function () {

    // Add the page method call as an onclick handler for the


    button.
    $("#btnSubmit").click(function () {

    //get the string from the textbox


    $.ajax({

    type: "POST",
    url: "testSearch.aspx/GetMyShippingDate",
    contentType: "application/json; charset=utf-8",
    data: "{'tracking_num': '" + $
    ("#txtTrackingNumber").val() + "'}",
    dataType: "json",
    success: function (date) {

    // Replace the div's content with the page


    method's return.
    Success(date);

    },
    error: Failed
    });
    });
    });

    function Success(result) {
    $("#ParcelShippingDate").html(result.d);
    }
    function Failed(result) {
    alert(result.status + " " + result.statusText);
    }

    </script>

      

     Your code behind in asp.net page


     [WebMethod]
    public static string GetMyShippingDate(string tracking_num)
    {
    if (tracking_num == "")
    {

    return "No Parcel Available";

    }
    else
    {
    return "TrackingNumber " + tracking_num + " will be
    delivered on 12/25/2025";
    }
    }
     http://webdeveloperpost.com/Articles/How-to-use-jquery-ajax-in-asp-dot-
    net-web-page.aspx
     http://www.fairnet.com/Blog/post/AJAX-using-jquery-and-ASPNET.aspx
     http://weblogs.asp.net/craigshoemaker/archive/2008/11/07/using-jquery-
    to-call-asp-net-ajax-page-methods-by-example.aspx

    You might also like