Call a WebService with ASP.Net Ajax

 In this post I’m going to show you a very simple example where I will from a Web
Form call a Web Service without reloading the page.When we will use ASP.Net Ajax on
our pages we need to add the <asp:ScriptManager> element.
The ScriptManager will automatically add the references to the required JavaScript
files that provide Atlas functionality. So it’s required on every page where we will
use the ASP.Net Ajax features.
When we want to add a reference to our WebService we use the Service child element
of the ScriptManager:


<asp:ScriptManager ID="ScriptManager1" runat="server">
      <Services>
          <asp:ServiceReference Path="~/WebService.asmx" />
      </Services>
  </asp:ScriptManager>
The code above will add a reference to “MyWebService.asmx”. Let’s take a look at the MyWebService:
using System;
using System.Web;
using System.Collections;
using System.Web.Services;
using System.Web.Services.Protocols;


/// 
/// Summary description for WebService
/// 
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService
{

   Public WebService()
 {

     //Uncomment the following line if using designed components
     //InitializeComponent();
 }

 [System.Web.Services.WebMethod]
 [System.Web.Script.Services.ScriptMethod]
 public  string MyMethod(string value)
 {
     return value;
 }

}
The addition of the [ScriptService] Attribute opens up this web service for use with AJAX.


<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ClientWebService.aspx.cs"
   Inherits="ClientWebService" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
   <title>Untitled Page</title>
</head>
<body>
   <form id="form1" runat="server">
   <asp:ScriptManager ID="ScriptManager1" runat="server">
       <Services>
           <asp:ServiceReference Path="~/WebService.asmx" />
       </Services>
   </asp:ScriptManager>
   <div>
       <input type="button" onclick="CallMyWebService();" id="myButton" value="Call MyWebService" />
   </div>
   </form>

   <script type="text/javascript">
function CallMyWebService()

{
     WebService.MyMethod("My Value", OnRequestComplete);
}
function OnRequestComplete(result)

{
   alert(result);
}

   </script>

</body>
</html>
Reactions

Post a Comment

0 Comments

Close Menu