Calling ASP.Net Code Behind using jQuery AJAX

With the help of the $.ajax() we can able to call the web method which is defined in the C# class . From the following example, the $.ajax() function will make asynchronous HTTP(Ajax) request to the web method called as getOutput().

jQuery Source Code

 
<script>
   $(document).ready(function () {
       $.ajax({
           type: "POST",
           url: "jQueryCall.aspx/getOutput",
           contentType: "application/json; charset=utf-8",
           dataType: "json",
           success: function (response) {
               $("#Content").text(response.d);
           },
           failure: function (response) {
               alert(response.d);
           }
       });
   });
</script>

Here we are specifying success: and failure: to show the kind of return data format we are expecting from the web method.

success: function (response)

On successful execution of the requested web method the ajax function will call the method to process the output.

Failure:Function(responce)

Failure method gets executed when there is some exception happens on web method execution.

C# Source Code

 
using System.Web.Services;
namespace WebApplication
{
    public partial class jQueryCall : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
        }
        [WebMethod]
        public static string getOutput()
        {
            return "This is from C# code behind!!";
        }
    }
}

It is important to note that, when we call a C# function in code-behind , the function must be defined as a static function, otherwise the ajax function cannot call it.

Next : How to include jQuery in ASP.Net project?