Выбор значений флажка на основе массива JSON ⇐ Jquery

[Anonymous]

Я храню некоторые значения идентификаторов в виде строк JSON в своей базе данных. Я использую те же идентификаторы, что и значения флажков в элементе управления флажком с множественным выбором Bootstrap в моей форме.
[{"formLookupId":16},{"formLookupId":23},{"formLookupId":17}]

Мой подход состоит в том, чтобы установить значение скрытого поля с помощью этого массива, а затем использовать JS для соответствующей установки выбранных значений флажка (поскольку я не могу сделать это на стороне сервера, поскольку они не являются серверными). элементы управления).


Мне близок этот подход, но я не уверен, чего мне здесь не хватает с точки зрения JavaScript. Может ли кто-нибудь помочь мне понять, что я делаю неправильно? У меня нет большого опыта работы с массивами json в JS, и мой код JS не проходит тестvalues.includes(parseInt(checkbox.value)). Кроме того, если есть лучший способ сделать это, более эффективный, который не требует создания моих элементов управления на стороне сервера, но позволяет мне манипулировать этими флажками на стороне сервера, я открыт для этого.Пример элемента управления флажком в формате HTML:
FooBar Checkbox

JS:
if ($('#hdnFormchkboxes').attr('value') != null && $('#hdnFormchkboxes').attr('value') != '') {
var hdnFormcheckedvals = $('#hdnFormchkboxes').attr('value');
var values = JSON.parse(hdnFormcheckedvals);

var container = document.querySelector('.ddlchkProfessionCheckboxes');
const checkboxes = container.querySelectorAll('input[type="checkbox"]');

checkboxes.forEach(checkbox => {
if (values.includes(parseInt(checkbox.value))) {
checkbox.checked = true;
}
});
}

ОБНОВЛЕНИЕ: я могу установить флажки как отмеченные, используя предложение Бармара при анализе данных json.
var values = JSON.parse(hdnFormcheckedvals).map(el => el.formLookupId);

var container = document.querySelector('.ddlchkProfessionCheckboxes');
const checkboxes = container.querySelectorAll('input[type="checkbox"]');

checkboxes.forEach(checkbox => {
if (values.includes(parseInt(checkbox.value))) {
checkbox.checked = true;
}
});

$('#ddlListBox').multiselect('rebuild');

Мне также удалось установить метки для выбранных флажков, которые были установлены с помощью JQuery, принудительно вызывая событие изменения флажка после его выбора.
$(checkbox).trigger('change');

Моя проблема сейчас заключается в том, что я хотел бы принудительно вызвать событие изменения для EventListener, который я уже создал в $(document).ready, поскольку я хотел бы собрать отмеченные флажки, чтобы повторить Логика выбранных флажков для моего дочернего списка, которая собирает параметры на основе того, что было выбрано в этом родительском списке. Кажется, мое событие изменения не затрагивает это событие изменения.
var container = document.querySelector('.ddlchkProfessionCheckboxes');

var checkboxesAll = container.querySelectorAll('input[type="checkbox"]');

checkboxesAll.forEach(function (checkbox) {
checkbox.addEventListener('change', (event) => {
const rwSeries = document.getElementById("rwddlSeries");
rwSeries.hidden = false;
var container = document.querySelector('.ddlchkProfessionCheckboxes');
var checkboxesAllchked = container.querySelectorAll('input[type="checkbox"]:checked');

const formIds = [];
debugger;
for (var i = 0, len = checkboxesAllchked.length; i < len; i++) {

formIds.push(checkboxesAllchked.value);
/*RdMessageVersionNums.push({ "hdnMessageVer": versionNum.value });*/

}
$jq.ajax({
async: false,
contentType: 'application/json; charset=utf-8',
dataType: 'json',
type: 'POST',
url: 'Messages.aspx/GetSeriesforFormIds',
data: "{'data':'" + JSON.stringify(formIds) + "'}",
success: function (data) {
//debugger;
if (data.d != null) {
const rwSeries = document.getElementById("rwddlSeries");
rwSeries.hidden = false;

var $checkboxContainer = $('.ddlchkSeriesCheckboxes .multiselect-container');
$checkboxContainer.html("");

var temp = data.d;

if (temp != '') {

//debugger;
var obj = $.parseJSON(temp);

//debugger;
var $container = $('.ddlchkSeriesCheckboxes select');
$container.html("");
if ((obj != '') && (obj.data.length > 0)) {
for (i = 0; i < obj.data.length; i++) {
$container.append('' + obj.data.text + '')
$checkboxContainer.append('' + obj.data.text + '')
}
}

}
}

//debugger;
$('#ddlListBox').multiselect('rebuild');
},
error: function (response) {
//alert(JSON.stringify(response));
}
});


Подробнее здесь: https://stackoverflow.com/questions/791 ... json-array