AGV
AGV

Reputation: 39

Calling WCF Service Using jquery Ajax failed with bad request response

calling wcf web service Using jquery-Ajax failed with bad request without knowing the exact problem. it's not even calling any methods success or failure. both the web service and the website is deployed on the same server using iis

the error:

Failed to load resource: the server responded with a status of 400 (Bad Request)

the code is used to call the service methods :

function test(){
     try {

       
        code = getValuesWrittenInTheURL[0] + "";

       
        var query = "select taskstatus,tasksubstatus,Lat,Lng,elementID from tasks_gvt where code = '" + code + "'";
        
        $.ajax({
            type: "POST",
            async: true,
            url: IP + "/GetData", 
            data: JSON.stringify({ Query: query }),
            dataType: "json",
            success: function (data) {
                debugger;
                console.log("data: ",data);
           
            },
            failure: function (errMsg) {
                debugger;
                console.log("err",errMsg);
                
            }
           
        });
    } catch (error) {
        console.log("alaaError", error.message);
    }
    
}

the wcf web service Operation contract:

 [WebInvoke(Method = "POST", RequestFormat = WebMessageFormat.Json, UriTemplate = "GetData", BodyStyle = WebMessageBodyStyle.WrappedRequest)]
        Response GetData(String Query);

ready to provide you with any more details.

Upvotes: 0

Views: 200

Answers (1)

Ding Peng
Ding Peng

Reputation: 3974

Below is the Ajax I successfully accessed the service, you can refer to it:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Ajax</title>
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
    </script>
    <script>
$(document).ready(function(){
    $("button").click(function () {
        code = "code";
        var query = "select taskstatus,tasksubstatus,Lat,Lng,elementID from tasks_gvt where code = '" + code + "'";
        da={"Query":query}
        $.ajax({
            type: "Post",
            dataType: "json",
           contentType: "application/json;charset=utf-8",
           data: JSON.stringify(da),
            url: "http://localhost/Service1.svc/GetData", success: function (result) {
        }});
    });
});
    </script>
</head>
<body>


    <button>Call WCF Rest Service</button>

</body>
</html>

You need to set contentType, and I see that you set BodyStyle to Wrapped,if it is set to Wrapped, the request format should be like this:

{"Query":query}

Upvotes: 1

Related Questions