Passing JSON data to a webservice

Question

I have two parameters (categoryName and categoryDescription) that I need to pass to the web service using JSON. I found the syntax to pass categoryName but have not been able to get the correct syntax to pass both parameters. Here is the code.

<script src="js/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">

    $(document).ready(function() {
        $('#hbtnCreateCategory').click(function(event) {
            $.ajax({
                type: "POST",
                url: "lwsServiceData.asmx/CreateHelpDeskCategory",
                data: "{'categoryName': '" + $('#categoryName').val() + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(msg) {
                    AjaxSucceeded(msg);
                },
                error: AjaxFailed
            });

        });

        function AjaxSucceeded(result) {
            alert(result.d);
            $('#result').val = result.d;
        }

        function AjaxFailed(result) {
            alert(result.status + ' ' + result.statusText);
        }

    });
</script>

Thanks in advance.

NakedBrunch · Answer 1 · 2010-07-13T18:36:35.483

2

Try this:

data: "{ categoryName :'" + $('#categoryName').val() + "' , categoryDescription: '" + $('#categoryDescription').val() + "' }",

Don't forget to update CreateHelpDeskCategory to accept both arguments.

To add a third argument, use the following:

data: "{ categoryName:'" + + $('#categoryName').val() + "' , categoryDescription: '" + + $('#categoryDescription').val() + "', modifiedBy:'jsmith' }",

edited Jul 13 '10 at 18:36

answered Jul 08 '10 at 20:59

NakedBrunch

48,713
13
73
98

1

Alison, Your code worked after I replaced the ++ with +. I want to pass a third string parameter to the web server called "modifiedBy". I used the following code but get an error: data: "{ categoryName :'" + $('#categoryName').val() + "' , categoryDescription: '" + $('#categoryDescription').val() + "' , modifiedBy:'jsmith ' " + "' }", Thanks in advanced. NC8 – blueDroid Jul 13 '10 at 17:55

score 1 · Answer 2 · edited May 23 '17 at 12:13

1

You should use

data: {categoryName: JSON.stringify($('#categoryName').val()),
       categoryDescription: JSON.stringify($('#categoryDescription').val())}

as a parameter of $.ajax method. The function JSON.stringify can used to serialize any data to JSON (can be downloaded from http://www.json.org/js.html). Manual serialization is not good at least because the possibility that the string which should be serialized contain characters which must be escaped (like '"' or '\' see http://www.json.org/).

Look at also to the another question which I answered before: How do I build a JSON object to send to an AJAX WebService?

edited May 23 '17 at 12:13

Community

1
1

answered Jul 08 '10 at 21:42

Oleg

220,925
34
403
798

Oleg, I find your code to be very readable and easy to understand. However, I pasted it onto my code and it did not work. What am I missing? Thanks, NC8 – blueDroid Jul 13 '10 at 17:23
WS code: [WebMethod] public int CreateHelpDeskCategory(string categoryName, string categoryDescription){DataCenterDataContext db = new DataCenterDataContext(); try{ HelpDeskCategory cat = new HelpDeskCategory { CategoryName = categoryName.Trim(), CategoryDescription = categoryDescription.Trim(), CreatedDate = DateTime.Now, }; db.HelpDeskCategories.InsertOnSubmit(cat); db.SubmitChanges(); return 1; } catch (Exception) { return 0; } – blueDroid Jul 13 '10 at 17:26
I don't see in your code `[ScriptMethod (ResponseFormat = ResponseFormat.Json)]` attribute. Do you use it or set the same behavior in web.config (it is possible in .NET 4.0)? – Oleg Jul 13 '10 at 17:57

score 0 · Answer 3 · answered Jul 08 '10 at 20:57

0

data: "{'categoryName': '" + $('#categoryName').val() + "', 'categoryDescription': 'some description'}"

and if it needs to be dynamic:

data: "{'categoryName': '" + $('#categoryName').val() + "', 'categoryDescription': '" + $('#categoryDescription').val() + "'}"

answered Jul 08 '10 at 20:57

Darin Dimitrov

1,023,142
271
3,287
2,928

I need to get the categoryDescription from
so I think I need to use something like $('#categoryDescription').val() – blueDroid Jul 08 '10 at 21:07
Yes, that's exactly what I suggested. – Darin Dimitrov Jul 08 '10 at 21:12
1

Darin: Your code works!! I am coming from ASP.Net and this is my first time learning JSON. I still have a bit of a problem concatenating the strings. Based on your samples I put together the following data and it does not work. Could you please check it out and let me know where I am making the mistake? data: "{'categoryName': '" + $('#categoryName').val() + "', 'createdBy': 'jsmith' " + "', 'categoryDescription': '" + $('#categoryDescription').val() + "'}", Thanks a lot. – blueDroid Jul 12 '10 at 14:47

score 0 · Answer 4 · answered Jul 08 '10 at 21:06

0

There's also this: http://code.google.com/p/jquery-json/

answered Jul 08 '10 at 21:06

Mike Baranczak

8,291
8
47
71

Passing JSON data to a webservice

4 Answers4