JavaScript - Building JSON object

Question

I'm trying to understand how to build a JSON object in JavaScript. This JSON object will get passed to a JQuery ajax call. Currently, I'm hard-coding my JSON and making my JQuery call as shown here:

$.ajax({
  url: "/services/myService.svc/PostComment",
  type: "POST",
  contentType: "application/json; charset=utf-8",
  data: '{"comments":"test","priority":"1"}',
  dataType: "json",
  success: function (res) {
    alert("Thank you!");
  },
  error: function (req, msg, obj) {
    alert("There was an error");
  }
});

This approach works. But, I need to dynamically build my JSON and pass it onto the JQuery call. However, I cannot figure out how to dynamically build the JSON object. Currently, I'm trying the following without any luck:

var comments = $("#commentText").val();
var priority = $("#priority").val();
var json = { "comments":comments,"priority":priority };

$.ajax({
  url: "/services/myService.svc/PostComment",
  type: "POST",
  contentType: "application/json; charset=utf-8",
  data: json,
  dataType: "json",
  success: function (res) {
    alert("Thank you!");
  },
  error: function (req, msg, obj) {
    alert("There was an error");
  }
});

Can someone please tell me what I am doing wrong? I noticed that with the second version, my service is not even getting reached.

Thank you

Excellent point - try running this with the Firebug debugger turned on and see what you get. — Justin Ethier
– Justin Ethier, Commented Mar 26, 2010 at 15:54
I am not getting any JavaScript errors. The error event handler in my $.ajax call is getting triggered though. — user208662
– user208662, Commented Mar 26, 2010 at 16:30
Well there you go... what error message are you getting back? Is it helpful? — Justin Ethier
– Justin Ethier, Commented Mar 26, 2010 at 17:00

Crescent Fresh · Accepted Answer · 2010-03-26 15:41:44Z

8

You may want to look at the JSON JavaScript library. It has a stringify() function which I think will do exactly what you need.

edited Mar 26, 2010 at 15:41

Crescent Fresh

117k27 gold badges157 silver badges140 bronze badges

answered Mar 26, 2010 at 15:33

LBushkin

132k33 gold badges218 silver badges265 bronze badges

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

6 Comments

Justin Ethier Over a year ago

That's what I thought initially, but from the code he is using in his example, jQuery is supposed to take care of this for you.

Crescent Fresh Over a year ago

@Justin Ethier: no, jQuery has no JSON serialization (only deserialization). jQuery does something completely different with the data object @user208662 is passing to it.

Mark Over a year ago

@Crescent Fresh: the docs (api.jquery.com/jQuery.ajax) have an example of doing data: ({id : this.getAttribute('id')})

Justin Ethier Over a year ago

Exactly. I use the same syntax in my application and it works just fine without stringify (which is still useful elsewhere, of course).

Crescent Fresh Over a year ago

@Mark, @Justin Ethier: again, jQuery does not use JSON serialization. The data object passed in @Mark's example and answer simply gets routed to jQuery.param() (api.jquery.com/jQuery.param), a different kind of serialization altogether.

|

Shaggy · Accepted Answer · 2012-05-09 00:40:07Z

6

Your code:

var comments = $("#commentText").val();
var priority = $("#priority").val();
var json = { "comments":comments,"priority":priority };

Take out the quotes ( line 3 ):

var comments = $("#commentText").val();
var priority = $("#priority").val();
var json = { comments: comments, priority: priority };

answered May 9, 2012 at 0:40

Shaggy

1632 silver badges10 bronze badges

Comments

plodder · Accepted Answer · 2010-03-26 16:08:12Z

3

Remove the quotes

data: '{"comments":"test","priority":"1"}',

becomes

data: {"comments":"test","priority":"1"},

JSONs are objects not strings.

answered Mar 26, 2010 at 16:08

plodder

2,25618 silver badges19 bronze badges

Comments

Rigobert Song · Accepted Answer · 2010-03-26 19:14:20Z

2

This should work

var json = { comments: "comments",priority: "priority" };

edited Mar 26, 2010 at 19:14

answered Mar 26, 2010 at 15:39

Rigobert Song

2,8122 gold badges31 silver badges49 bronze badges

1 Comment

justkt Over a year ago

As far as I understand it, in JSON all strings need to be double quoted, so "comments" and "priority". That is a Javascript object, so if you were trying to show just a Javascript object, it is valid. For the JSON format, though, strings need double quotes.

Harry · Accepted Answer · 2013-10-18 15:22:29Z

2

this works for me.

var json = "{ 'comments': '" + *comments* +"','priority:' '" + *priority* +"' }";

italics are the variables.

edited Oct 18, 2013 at 15:22

Harry

90.1k26 gold badges216 silver badges224 bronze badges

answered Sep 15, 2011 at 12:08

Arindam Nayak

7,4924 gold badges36 silver badges51 bronze badges

1 Comment

Dilshan Over a year ago

What happens if the comments and priority variables also includes double quotes? This fails. Not the ideal solution.

Collectives™ on Stack Overflow

JavaScript - Building JSON object

5 Answers 5

6 Comments

Comments

Comments

1 Comment

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

6 Comments

Comments

Comments

1 Comment

1 Comment

Related