how to pass string parameter to webmethod in a web service from JQuery

Question

Here is my webmethod in a web service (local to the sample project) .asmx

[WebMethod]
    public List<test1> GetLstB(string s)
    {
        test1 t;
        List<test1> lstB = new List<test1>();
        t = new test1()
        {
            itm1 = "aaa" + s,
            itm2 = "bbb" + s
        };
        lstB.Add(t);

        t = new test1()
        {
            itm1 = "ccc" + s,
            itm2 = "ddd" + s
        };
        lstB.Add(t);


        return lstB;
    }

public class test1
{
    public string itm1 { get; set; }
    public string itm2 { get; set; }
}

and here is the JQuery that calls this webmethod

$(function () {
    $("[id*=Button4").click(function () {
        var x = 'xyz';
        $.ajax({
            type: "POST",
            url: "ServiceCS.asmx/GetLstB",
            data: "{'" + x + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",            
            success: function (result) {
                for (var i in result.d) {
                    alert(result.d[i].itm1 + "--" + result.d[i].itm2);
                }
            },

            error: function (r) {
                alert(r.responseText);
                console.log("AJAX error in request: " + JSON.stringify(r, null, 2));
            },
            failure: function (r) {
                alert(r.responseText);
            }
        });
        return false;
    });
});

I ran this JQuery function without passing a parameter (var x = 'xyz';) and the webmethod returned the object list which I iterated through in JQuery without any problems. But then I decided to try passing a parameter to the webmethod (also tried "xyz") and now I get this error -- how do I pass the parameter var x = "xyz"; to the webmethod correctly?

"Message\":\"Invalid object passed in, \u0027:\u0027 or \u0027}\u0027 expected. (7): {\u0027xyz\u0027}\",\"StackTrace\":\" at System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializeDictionary(Int32 depth)\r\n at System.Web.Script.Serialization.JavaScriptObjectDeserializer.DeserializeInternal(Int32 depth)\r\n at System.Web.Script.Serialization.JavaScriptObjectDeserializer.BasicDeserialize(String input, Int32 depthLimit, JavaScriptSerializer serializer)\r\n at System.Web.Script.Serialization.JavaScriptSerializer.Deserialize(JavaScriptSerializer serializer, String input, Type type, Int32 depthLimit)\r\n at System.Web.Script.Serialization.JavaScriptSerializer.Deserialize[T](String input)\r\n at System.Web.Script.Services.RestHandler.GetRawParamsFromPostRequest(HttpContext context, JavaScriptSerializer serializer)\r\n at System.Web.Script.Services.RestHandler.GetRawParams(WebServiceMethodData methodDat

ARr0w · Accepted Answer · 2017-02-27 10:42:28Z

1

above both answers are still clueless for the beginners. as javaScript and jquery is case sensitive.

the correct syntax to pass arguement is

data: "{'s':'"+x+"'}"

answered Feb 27, 2017 at 10:42

ARr0w

1,73115 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Nalin Aggarwal · Accepted Answer · 2016-08-25 22:16:40Z

0

The parameter should be like this.

$(function () {
    $("[id*=Button4").click(function () {
        var x = 'xyz';
        $.ajax({
            type: "POST",
            url: "ServiceCS.asmx/GetLstB",
            data: "{'s:" + x + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",            
            success: function (result) {
                for (var i in result.d) {
                    alert(result.d[i].itm1 + "--" + result.d[i].itm2);
                }
            },

            error: function (r) {
                alert(r.responseText);
                console.log("AJAX error in request: " + JSON.stringify(r, null, 2));
            },
            failure: function (r) {
                alert(r.responseText);
            }
        });
        return false;
    });
});

Or you can do is :

 data:JSON.stringify({ s:  x})

edited Aug 25, 2016 at 22:16

answered Aug 25, 2016 at 22:05

Nalin Aggarwal

8885 silver badges9 bronze badges

2 Comments

rich dvc Over a year ago

He He :) Thank you. I just figured it out, but you guys are faster. I have to add the parameter name 's' in the data: call.

rich dvc Over a year ago

and using jquery.json-2.4.min.js you can say $("[id*=Button4").click(function () { var parm = 'xyz'; var parm2 = 3; var params = new Object(); params.s = parm; params.i = parm2; ........ data: $.toJSON(params), ........ incase the webmethod gets more parameters added.

shady youssery · Accepted Answer · 2016-08-25 22:00:36Z

0

$(function () {
    $("[id*=Button4]").click(function () {
        var x = 'xyz';
        $.ajax({
        type: "POST",
        url: "ServiceCS.asmx/GetLstB",
        data: {s:x},
        contentType: "application/json; charset=utf-8",
        dataType: "json",            
        success: function (result) {
            for (var i in result.d) {
                alert(result.d[i].itm1 + "--" + result.d[i].itm2);
            }
        },

        error: function (r) {
            alert(r.responseText);
            console.log("AJAX error in request: " + JSON.stringify(r, null, 2));

answered Aug 25, 2016 at 22:00

shady youssery

4402 silver badges17 bronze badges

Collectives™ on Stack Overflow

how to pass string parameter to webmethod in a web service from JQuery

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related