locked
Call ASP.NET Web Service from JavaSrcipt RRS feed

  • Question

  • User429415559 posted

    Hi guys,

    I created Website .asmx with Web Service which return string "Hello World" and deploy it on IIS. Now I try to consume this Web Service from another project but with Client-side not in Server-side. Can you give me some advice to solve problem?

    Thanks.

    My code in deployed website:

    [ServiceContract]

    public interface IService

    {

                    [OperationContract]

                    string GetData(int value); 

                    [OperationContract]

                    CompositeType GetDataUsingDataContract(CompositeType composite);             

    } 

    [DataContract]

    public class CompositeType

    {

                    bool boolValue = true;

                    string stringValue = "Hello "; 

                    [DataMember]

                    public bool BoolValue

                    {

                                    get { return boolValue; }

                                    set { boolValue = value; }

                    } 

                    [DataMember]

                    public string StringValue

                    {

                                    get { return stringValue; }

                                    set { stringValue = value; }

                    }

    public class Service : IService

    {

           public string GetData(int value)

           {

                  return string.Format("You entered: {0}", value);

           } 

           public CompositeType GetDataUsingDataContract(CompositeType composite)

           {

                  if (composite == null)

                  {

                         throw new ArgumentNullException("composite");

                  }

                  if (composite.BoolValue)

                  {

                         composite.StringValue += "Suffix";

                  }

                  return composite;

           }

    }

    Thursday, December 5, 2013 12:01 PM

Answers

  • User653228039 posted

    jquery has a great utility for this.  Check out the .ajax() function in jQuery:

    http://api.jquery.com/jQuery.ajax/

    Your code might look something like this:

    $.ajax(
    {
        type:"POST",
        dataType:"text",
        url:"yourWebservice.asmx/GetData",
        data:{"value":42},
        success:function(data)
        {
            //here is where you do something with the returned data.
        }
    });


    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, December 5, 2013 12:21 PM
  • User-1509636757 posted

    Hello, on client side you can use jQuery ajax to directly call the wcf method by passing in the url. Below is the sample:

    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script type="text/javascript" src="Scripts/jquery-1.9.1.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
    
            });
    
            function GetDataFromAPI() {
                $.ajax({
                    type: "POST",
                    url: "SampleService.svc/GetUserDataByID",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    data: "{ 'ID': '123' }",
                    success: function (data) {
                        if (data != null) {
                            //-- use the data.. write some logic.. or assign the values from data to html controls
                        }
                    },
                    error: function (result) {
                        alert('Unable to load data: ' + result.responseText);
                    }
                });
            }
        </script>
    </head>

    you might want to look at the detailed article on this; Calling WCF Services using jQuery

    hope it helps./.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, December 5, 2013 12:22 PM

All replies

  • User653228039 posted

    jquery has a great utility for this.  Check out the .ajax() function in jQuery:

    http://api.jquery.com/jQuery.ajax/

    Your code might look something like this:

    $.ajax(
    {
        type:"POST",
        dataType:"text",
        url:"yourWebservice.asmx/GetData",
        data:{"value":42},
        success:function(data)
        {
            //here is where you do something with the returned data.
        }
    });


    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, December 5, 2013 12:21 PM
  • User-1509636757 posted

    Hello, on client side you can use jQuery ajax to directly call the wcf method by passing in the url. Below is the sample:

    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script type="text/javascript" src="Scripts/jquery-1.9.1.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
    
            });
    
            function GetDataFromAPI() {
                $.ajax({
                    type: "POST",
                    url: "SampleService.svc/GetUserDataByID",
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    data: "{ 'ID': '123' }",
                    success: function (data) {
                        if (data != null) {
                            //-- use the data.. write some logic.. or assign the values from data to html controls
                        }
                    },
                    error: function (result) {
                        alert('Unable to load data: ' + result.responseText);
                    }
                });
            }
        </script>
    </head>

    you might want to look at the detailed article on this; Calling WCF Services using jQuery

    hope it helps./.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, December 5, 2013 12:22 PM