Using Foreach or another function to reduce the amount of code

Question

please help. I have such a code with Checkboxes. I need to shorten it, namely to go through it through Foreach. If you can shorten it in another way, then please write it..

let FormData = {
   DisplayName: $("#DisplayName").is(":checked"),
   Department: $("#Department").is(":checked"),
   Post: $("#Post").is(":checked"),
   Phone: $("#Phone").is(":checked"),
   Location: $("#Location").is(":checked"),
   Dinner: $("#Dinner").is(":checked")
} 
console.log(JSON.stringify(FormData));

I haven't really tried anything yet. But I didn't really find the answer I needed..

These appear to be what you're after: [Serialize form to JSON](https://stackoverflow.com/questions/11338774/serialize-form-data-to-json) / [Convert form to javascript](https://stackoverflow.com/questions/1184624/convert-form-data-to-javascript-object-with-jquery) - put your inputs in a `
` and do `Object.fromEntries(new FormData(form))` (non jquery version) there's lots of other options on those questions. — freedomn-m, Jan 23 '23 at 11:22
Sorry, but.. I need to iteratively shorten this code. Namely with the help of *Foreach* — Alexander Degurechaff, Jan 23 '23 at 11:25
So ... you want to make the code *longer* than it needs to be? — freedomn-m, Jan 23 '23 at 12:17
On the contrary, I need to shorten it. I've already found a great answer, which is below. Therefore, thank you for the help offered. — Alexander Degurechaff, Jan 23 '23 at 12:40

score 1 · Answer 1 · answered Jan 23 '23 at 11:28

You can declare the fields separately in an array and then use the Array.reduce method to make the object you want:

let FormData = ['DisplayName', 'Department', 'Post', 'Phone', 'Location', 'Dinner'].reduce((acc, field) => {
    acc[field] = $(`#${field}`).is(':checked');
    return acc;
}, {});

score 0 · Accepted Answer · answered Jan 23 '23 at 11:45

0

If you don't know the names of the checkboxes and you want to perform this operation of collecting their state on all the checkboxes of a form, you can use this code.

var jsonObject = {};

// For each checkbox - Feed Json object
$('input[type=checkbox]').each(function(index){ jsonObject[$(this).attr('id')] = $(this).is(':checked'); });

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

The principle is to use a selection of the checkboxes present on the page to then perform a loop on this selection and recover for each of the boxes their ID and their state.

answered Jan 23 '23 at 11:45

Juan

690
4
15

Hello, what you need. Thank you. But I will have one more request for you. If you can help me with that... Now I need to add a profileId or my own element to this JSON. – Alexander Degurechaff Jan 23 '23 at 11:59
Generate the `jsonObject` (which will be a javascript object, add your additional fields *to the object* - *then* call `JSON.stringify(obj)` - don't try and "add to the JSON" - it's simply not worth the effort compared with a simple `obj.field = value`. – freedomn-m Jan 23 '23 at 12:18
@AlexanderDegurechaff. I'm glad if this solution is what you need but I don't understand what you mean by "I need to add a profileid" – Juan Jan 23 '23 at 13:03
1

@Juan All good. I did everything on the sly myself. So don't worry. Thank you very much. – Alexander Degurechaff Jan 23 '23 at 13:54

Using Foreach or another function to reduce the amount of code

2 Answers2