CODEWITHSUNDEEP
c#asp.netjqueryjsonasmx
Hannoun Yassir
Hannoun Yassir

Reputation: 21182

Send JSON to webmethod?

How can i send a JSON object to a webmethod using jQuery?

Upvotes: 9

Views: 18467

Answers (7)

Nalan Madheswaran
Nalan Madheswaran

Reputation: 10562

Sample code is here:

var dataString = JSON.stringify({
                            contractName: contractName,
                            contractNumber: contractNumber
                        });

                        $.ajax({
                            type: "POST",
                            url: "CreateQuote.aspx/GetCallHistory",
                            data: dataString,
                            contentType: "application/json; charset=utf-8",
                            dataType: "json",
                            success: function (result) {
                                alert(result.CallHistoryDescription);
                                    OpenLightBox('divDelete');

                            }
                        });


        [System.Web.Services.WebMethod]
        public static object GetCallHistory(string contractName, string contractNumber)
        {
            return new
            {
                CallHistoryDescription = "Nalan"
            };

        }

Upvotes: 0

naugtur
naugtur

Reputation: 16915

JSON.stringify does help, but:

  1. it's not cross-browser take a look here: http://www.sitepoint.com/blogs/2009/08/19/javascript-json-serialization/#

  2. For browser in-built functions - every browser will have its problems. If You use the above serialization You will need to:

    • remove newlines with regexp in strings
    • take care about " in strings

Upvotes: 0

ceejayoz
ceejayoz

Reputation: 179994

Another library you can use is the jquery-json library. Once included:

var json = $.toJSON(your_object);

Upvotes: 6

Jeff Sternal
Jeff Sternal

Reputation: 48583

The most convenient solutions I've seen simplify this by using the open-source JSON2.js library to parse and 'stringify' complex object data.

These two excellent articles go into detail:

The second article might be especially relevant for you, though it calls a web service method with the following signature ...

public void SendValues(List<string> list)

... it demonstrates how to use the JSON2.js library to render a List<string> in javascript (using jQuery, this example is taken directly from the second article):

var list = ["a", "b", "c", "d"];
var jsonText = JSON.stringify({ list: list });

// The 'list' is posted like this

$.ajax({
    type: "POST",
    url: "WebService1.asmx/SendValues",
    data: jsonText,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function() { alert("it worked"); },
    failure: function() { alert("Uh oh"); }
});

Just use your webmethod URL in lieu of the web service's.

Upvotes: 5

Christian C. Salvad&#243;
Christian C. Salvad&#243;

Reputation: 827256

WebMethods expect a string containing JSON that will be parsed on the server-side, I use the JSON.stringify function to convert a parameters object to string, and send the data, I have a function like this:

jQuery.executePageMethod = function(location, methodName, methodArguments,
                                    onSuccess, onFail) {
    this.ajax({
        type: "POST",
        url: location + "/" + methodName,
        data: JSON.stringify(methodArguments), // convert the arguments to string
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data, status) {
            var jsonData = JSON.parse(data.d);
            onSuccess(jsonData, status);
        },
        fail: onFail
    });
};

I recommend you to include the json2.js parser in your pages, to have the JSON.stringify function cross-browser available.

Upvotes: 11

lomaxx
lomaxx

Reputation: 115763

You'd need to post it using Ajax and accept the incoming string on the webmethod. Then you'd need to use the JavaScript deserializer to convert it into an object on the server side.

Upvotes: 0

TheVillageIdiot
TheVillageIdiot

Reputation: 40497

Please refer to this article by Dave Ward. It is a complete tutorial on doing this stuff. Also you will find there other great jquery/ASP.net stuff.

EDIT:- Dave is calling method without any arguments, you can replace empty data property with actual data you want to send:

$.ajax({
  type: "POST",
  url: "Default.aspx/GetDate",
  data: "{'name':'tiger1','hobbies':['reading','music']}",//PUT DATA HERE
  contentType: "application/json; charset=utf-8",
  dataType: "json",

Upvotes: 21

Related Questions