Web Service (ASMX, ASPX, WCF ) and Ajax Call
1. Use JQuery Ajax call ASMX web method directly
The reason need to add [System.Web.Script.Services.ScriptService] is Ajax does not support SOAP message, which provide byasmx by default.
|
[System.Web.Script.Services.ScriptService] public class WebService1 : System.Web.Services.WebService { [WebMethod] public string HelloWorld() { return "Hello World"; } } function CallService() { $.ajax({ url: "WebService1.asmx/HelloWorld", type: "POST", contentType: "application/json; charset=utf-8", dataType: "json", data: "{}", success: function (data, textStatus) { if (textStatus == "success") { alert(data.d); } }, error: function (data, status, error) { alert(error); } }); }
|
OR
|
[System.Web.Script.Services.ScriptService] public class WebService1 : System.Web.Services.WebService { [WebMethod] [ScriptMethod(UseHttpGet = true)] public string HelloWorld() { return "Hello World"; } } function CallService() { $.ajax({ url: "WebService1.asmx/HelloWorld", type: "GET", dataType: "json", contentType: "application/json; charset=utf-8", success: function (data, textStatus) { if (textStatus == "success") { alert(data.d); } }, error: function (data, status, error) { alert(error); } }); }
|
2. Use Ajax Script Manager call ASMX web methoddirectly
|
[System.Web.Script.Services.ScriptService] public class WebService1 : System.Web.Services.WebService { [WebMethod] public string HelloWorld() { return "Hello World"; } }
|
3. Use JQuery Ajax call ASPX web method directly
|
public partial class About : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) {
}
[WebMethod] public static string HelloWorld() { return "Hello World 2"; } function CallService() { $.ajax({ url: "About.aspx/HelloWorld", type: "POST", dataType: "json", contentType: "application/json; charset=utf-8", data:"{}", success: function (data, textStatus) { if (textStatus == "success") { alert(data.d); } }, error: function (data, status, error) { alert(error); } }); }
CallService();
|
4. Use Ajax Script Manager call ASPX web method directly
|
public partial class About : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) {
}
[WebMethod] public static string HelloWorld() { return "Hello World 2"; } <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" > </asp:ScriptManager> <script type="text/javascript"> PageMethods.HelloWorld(OnCallSumComplete, OnCallSumError); function OnCallSumComplete(result, txtresult, methodName) { alert(result); } function OnCallSumError(error, userContext, methodName) { alert(error); } </script>
|
5. Use Jquery call WCF directly
|
Add Ajax-Enable WCF Service [ServiceContract(Namespace = "")] [AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)] public class Service3 { // To use HTTP GET, add [WebGet] attribute. (Default ResponseFormat is WebMessageFormat.Json) // To create an operation that returns XML, // add [WebGet(ResponseFormat=WebMessageFormat.Xml)], // and include the following line in the operation body: // WebOperationContext.Current.OutgoingResponse.ContentType = "text/xml"; [OperationContract] public string DoWork() { // Add your operation implementation here return "Do Work"; } function CallService() { $.ajax({ url: "Service1.svc/DoWork", type: "POST", dataType: "json", contentType: "application/json; charset=utf-8", data:"{}", success: function (data, textStatus) { if (textStatus == "success") { alert(data.d); } }, error: function (data, status, error) { alert(error); } }); }
|
OR
|
<%@ServiceHost language=c# Debug="true" Service="WebApplication1.CalculatorService" Factory=System.ServiceModel.Activation.WebScriptServiceHostFactory %>
[ServiceContract(Namespace = "")] [AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)] public class CalculatorService { [OperationContract] public string DoWork() { // Add your operation implementation here return "Do Work 2";
function CallService() { $.ajax({ url: "Service2.svc/DoWork", type: "POST", dataType: "json", contentType: "application/json; charset=utf-8", data:"{}", success: function (data, textStatus) { if (textStatus == "success") { alert(data.d); } }, error: function (data, status, error) { alert(error); } }); }
|
