How do I set multiple values of a JSON object?

Question

So I've been working on this project but I'm stuck because I can't figure out how I should go about setting the other values of this new JSON object. So basically on the front end I have this: HTML page view. The 'cat4' ID is the new object I tried to create, and illustrates the error I'm trying to fix. The problem is that I'm having trouble setting the LIMIT value of newly created objects (or multiple values at all). Here is the code where the object is created:

function sendCat()
{
  window.clearTimeout(timeoutID);
  var newCat = document.getElementById("newCat").value
  var lim = document.getElementById("limit").value
  var data;
  data = "cat=" + newCat + ", limit=" + lim;
  var jData = JSON.stringify(data);
  makeRec("POST", "/cats", 201, poller, data);
  document.getElementById("newCat").value = "Name";
  document.getElementById("limit").value = "0";
}

In particular I've been playing around with the line data = "cat=" + newCat + ", limit=" + lim; but no combination of things I try has worked so far. Is there a way I can modify this line so that when the data is sent it will work? I find it odd that the line of code works but only for setting one part of the object.

shouldn't it be `"cat:" + newCat + ", limit:" + lim;` ? But anyway, you are creating a string then "stringifying" it, seems weird, why not create an object with all properties and then stringify? — Calvin Nunes, Dec 03 '19 at 21:01
First of all, you're not using `jData` anywhere. Is that a typo? You're not using JSON anywhere otherwise. Second, without knowing what `makeRec()` does, we don't know the correct format of its parameters, so we cannot tell you where your mistake is. — Vilx-, Dec 03 '19 at 21:02
Please review the [documentation for object initilizers](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Object_initializer) since you are currently creating a string not an object. — Quentin, Dec 03 '19 at 21:02
Perhaps [this is what you really want](https://stackoverflow.com/questions/1714786/query-string-encoding-of-a-javascript-object) (what you really want is wild speculation though as Vilx- indicated) — Quentin, Dec 03 '19 at 21:03

Klaycon · Answer 1 · 2019-12-03T21:08:29.567

-1

What you're referring to as a 'JSON object' is actually just a javascript object, you can make one using object literal syntax. An object literal with multiple properties looks like this:

var data = {
  cat: newCat,
  limit: lim
};
makeRec("POST", "/cats", 201, poller, JSON.stringify(data));

assuming the fifth parameter to makeRec is supposed to be the POST request body as stringified JSON, as your code seems to imply

edited Dec 03 '19 at 21:08

answered Dec 03 '19 at 21:04

Klaycon

10,599
18
35

Their code implies it should be a application/x-www-form-urlencoded string. Their question title implies it should be JSON. The question is a confusing collection of contradictions. – Quentin Dec 03 '19 at 21:08

score -1 · Answer 2 · answered Dec 03 '19 at 21:06

The JSON.stringify() method converts a JavaScript object or value to a JSON string, optionally replacing values if a replacer function is specified or optionally including only the specified properties if a replacer array is specified.

MDN

I think this is what you want:

const newCat = 'Meow';
const newLimit = 5;
const data = {
  cat: newCat,
  limit: newLimit
}

console.log(JSON.stringify(data));

How do I set multiple values of a JSON object?

2 Answers2