Call Asp.net Page Method Using Jquery 

<html>
<head runat="server">
    <title>Ajax Page</title>
    <script type="text/javascript" src="../Library/jquery-1.6.2.min.js"></script>
    <script type="text/javascript" language="javascript">
        function CalllPageMethod() { // this will be called on button click event
               $.ajax({
                type: "POST",
                url: "Default.aspx/" + "GetData", // Default.page is your page and GetData is Your public Method inside code behind file which will return some response.
                data: "{'FirstName': '"+$("input#txtFirstName").val()+"'}",// Here i am passing the value of txtFirstname to GetData method
//FirstName is parameter of GetData method
                contentType: "application/json; charset=utf-8",
                datatype: "json",
                success: onSuccess, //onSuccess is the name of method which will be called when response is received from server
                fail: onFail //fail is the name of method namd this will be called when their is some error in getting the response from server
            });
        }

        function success(response) {
            alert(response.d);
        }
        function fail(response) {
            alert("error");
        }
          
          
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div class="tm">
    </div>
    <input type="text"  id="txtFirstName"/>
     <input type="button" value="load Value" id="Btn" onclick="CalllPageMethod();" />
    </form>
</body>
</html>   


This is webmethod inside code behind file default.aspx.cs

 [System.Web.Services.WebMethod]
        public static string GetData(string FirstName)
        {
            return "Welcome Mr "+FirstName;
        }

 

Comments

Popular posts from this blog

Insert, Delete Rows, columns in HTML table Using Javascript

Open source Social Networking site in Asp.net and Microsoft Ajax

Crop image using c#