Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Call remote asmx service by JQuery always fail

I want to use below service throw JQuery: http://www.webservicex.net/globalweather.asmx/GetCitiesByCountry But it only execute the error function, I tried below :

        function serviceCall() {
        var txtInput = $("#txtInput").val();
        var webMethod = 'http://www.webservicex.net/globalweather.asmx/GetCitiesByCountry';
        var datap = {"CountryName":JSON.stringify("Italy")}; 

        $("#divResult").html('loading...');

        $.ajax({
            type: "POST",
            url: webMethod,
            data: datap,// { "CountryName" : JSON.stringify("Italy")},
            contentType: "application/json; charset=utf-8",
            dataType: "jsonp", //for Firefox change this to "jsonp"
            success: function (response) {
                alert("reached success");
                $("#divResult").html(response.d);
            },
            error: function (e) {
                $("#divResult").html("Unavailable: " + txtInput);
            }
        });
    }

SO I receive Unavailable: Italy

Below is full page code :

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
        function serviceCall() {
        var txtInput = $("#txtInput").val();
        var webMethod = 'http://www.webservicex.net/globalweather.asmx/GetCitiesByCountry';
        var datap = {"CountryName":JSON.stringify("Italy")}; 

        $("#divResult").html('loading...');

        $.ajax({
            type: "POST",
            url: webMethod,
            data: datap,// { "CountryName" : JSON.stringify("Italy")},
            contentType: "application/json; charset=utf-8",
            dataType: "jsonp", //for Firefox change this to "jsonp"
            success: function (response) {
                alert("reached success");
                $("#divResult").html(response.d);
            },
            error: function (e) {
                $("#divResult").html("Unavailable: " + txtInput);
            }
        });
    }
</script>

<title></title>
</head>
<body>
<form id="form1" runat="server">
    <input type="text" id="txtInput" value="Italy"/>
    <br />
     <div style="width: 100px; height: 30px; background-color: yellow;" onclick="serviceCall();">
    Click me</div>
<div id="divResult" runat="server">

</div>
</form>
</body>
</html>

Any help to fix that?

like image 509
Bashar Abu Shamaa Avatar asked Dec 06 '25 08:12

Bashar Abu Shamaa


1 Answers

I can see several mistakes here:

  • the dataType has to be json, not jsonp
  • your payload (the value of data) has to be a json-object entirely serialized
  • is your WebMethod a ScriptMethod?

Can't exactly tell what is wrong though. I need to see the error message from the server.


Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!