Заполните список флажков с помощью переключателя
Я пытаюсь заполнить группу report_id в следующих флажках, созданных следующим циклом for, щелкнув переключатель.
<div class = "col"><h4 style = "margin-top: 0"><strong>Application Suite</strong></h4><input type = "radio" id = "radio1" name = "suite" value = "1" onclick = "CheckBoxes">>Executive CFO Suite</div>
<div class = "container">
<div class = "col-md-4">
{% if fingrouplist is not None %}
<h4><strong>Financial</strong/></br></br><input type = "checkbox" onClick = "togglerep(this)" /> Select All</h4>
<ul>
{% for app in fingrouplist %}
<li><input type = "checkbox" name = "report_id" value = "{{app.report_id}}" > {{ app.report_name_sc }}</li>
{% endfor %}
</ul>
{% endif %}
</div>
Для этого я использую следующую javascript-функцию OnClick, я полный новичок. Я безуспешно пробовал следующее:
function CheckBoxes(selection) {
if (selection == 1) {
$('#Report_Id').prop('checked', true) == '15', '16', '17', '18', '19', '22', '23', '26', '28', '29', '30', '31', '33','34', '35', '36', '39', '40', '47', '48', '50', '52', '59', '60';
}
}
Иногда список report_id не всегда включает все параметры, но я хочу включить только те параметры, которые существуют с пользовательскими настройками в их report_id, полученном из цикла for.
У меня также есть созданный объект python, который определяет список отчетов, поэтому, если я могу получить его с помощью этой опции, вместо того, чтобы вводить список чисел, это может быть лучшим маршрутом.
rolebased = QvReportList.objects.filter(role_based_id__exact = '1').values('report_id', 'report_name_sc').distinct()
Приветствуется любая помощь, которая поможет мне двигаться в правильном направлении.
Я пытаюсь проверить эти идентификаторы отчета в форме при нажатии переключателя. Я не уверен, что искать, потому что не могу найти простого примера.
Дайте мне посмотреть, понял ли я, когда вы нажимаете радиокнопку, вам нужно установить некоторые флажки, я прав?
Вы пробовали добавить все идентификаторы флажков? $('#checkbox_id_1, #checkbox_id_2, #checkbox_id_3, ...., #checkbox_id_60').prop('checked', true)
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
В вашем коде куча ошибок. Во-первых, вы должны использовать () для вызова функции, а не только ее имени, поэтому вам нужно будет изменить переключатель следующим образом:
<input type = "radio" id = "radio1" name = "suite" value = "1" onclick = "CheckBoxes(this)">
Затем вам нужно будет изменить код функции, чтобы получить все значения отмеченных ckeckboxes;
function CheckBoxes(clicked) {
// array of checkboxes to check
var checked = [15, 16, 17, 18, 19, 22, 23, 26, 28, 29, 30, 31, 33, 34, 35, 36, 39, 40, 47, 48, 50, 52, 59, 60];
// if the radio button is checked
if ($(clicked).is(':checked')) {
// for each checked checkbox
$('input[name* = "report_id"]').each(function() {
// set as checked if the value is defined in the array
// Convert $(this).val() to Numnber() to compare against a number
$(this).prop('checked', checked.indexOf(Number($(this).val())) >= 0);
});
}
}
В качестве примечания, если вы собираетесь отправить форму с несколькими флажками с одним и тем же именем, вам следует использовать определение имени массива []. В вашем случае это будет (обратите внимание на использование квадратных скобок в определении имени):
<input type = "checkbox" name = "report_id[]" value = "{{app.report_id}}" >
Проверьте мой рабочий фрагмент:
function CheckBoxes(clicked) {
// Array of checked values
var checked = [1, 2, 5];
// if the radio button is checked
if ($(clicked).is(':checked')) {
// for each checked checkbox
$('input[name* = "report_id"]').each(function() {
// set as checked if the value is defined in the array
// Convert $(this).val() to Numnber() to compare against a number
$(this).prop('checked', checked.indexOf(Number($(this).val())) >= 0);
});
}
}<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type = "radio" onclick = "CheckBoxes(this)">
<ul>
<li><input type = "checkbox" value = "1" name = "report_id[]"> Value 1</li>
<li><input type = "checkbox" value = "2" name = "report_id[]"> Value 2</li>
<li><input type = "checkbox" value = "3" name = "report_id[]"> Value 3</li>
<li><input type = "checkbox" value = "4" name = "report_id[]"> Value 4</li>
<li><input type = "checkbox" value = "5" name = "report_id[]"> Value 5</li>
</ul>Надеюсь, поможет.
Спасибо за руководство, muecas.
Чего вы пытаетесь достичь? Получить все значения отмеченных флажков?