I didn't find out, how to create a json message in jquery with dynamic values for a key array element.
I'm trying to build a json message like this:
{
"line": {
"name": "Test",
"images": [
{
"order": "1",
"link": "https://google.com/1.jpg",
"name": "1.jpg"
},
{
"order": "2",
"link": "https://google.com/2.jpg",
"name": "2.jpg"
}
]
}
}
I fail to attach the pictures to the message.
jsonObbj = {};
line = {};
line ["name"] = $("#name").val();
counter = 1;
$("div.carousel_image > img").each(function() {
image = {};
image ["order"] = counter;
image ["name"] = $(this).attr('src');
line ["images"].push(image); // How can I edit this image to the images array
counter++;
});
// how can I add the line to the array
Thx for your help!
You need to initialize line.images to an empty array.
jsonObbj = {};
line = {};
line ["name"] = $("#name").val();
line["images"] = []; // add this line
counter = 1;
$("div.carousel_image > img").each(function() {
image = {};
image ["order"] = counter;
image ["name"] = $(this).attr('src');
line ["images"].push(image); // How can I edit this image to the images array
counter++;
});
Note, in general, when your object keys are normal strings, you want to use dot notation: line.images
JSFiddle: https://jsfiddle.net/to4xhewu/
You need to initialise line.images as an array before you can start pushing to it. You should also make sure you declare your variables properly with const, let or var or else they will be implicitly global.
Try this for a simple, object literal initialiser alternative
const jsonObbj = {
line: {
name: $("#name").val(),
images: $("div.carousel_image > img").map((i, img) => ({
order: i + 1,
name: img.getAttribute("src"),
link: img.src
})).get()
}
}