Отключение флажок из DataTable по всей странице в зависимости от зарегистрированного предела ⇐ Javascript

[Anonymous]

У меня есть форма, которая представлена ​​в качестве данных с контролем над каждой строкой. Пользователь должен иметь возможность проверить до 10 флажков. После того, как десятая проверена, все неконтролируемые флажки должны быть отключены, пока пользователь не проверит хотя бы один, чтобы вернуться ниже предела. Все работает нормально, за исключением случаев, когда я начинаю играть с количеством рядов на страницу. Если я перехожу от 25 до 10 рядов, а затем перехожу через разные страницы, некоторые флажки все еще отключены, а другие - нет. Общее количество зарегистрированных флажков всегда верно. Я не уверен, как обновить атрибут «Отключить», когда таблица перерисована.

Код: Выделить всё

Select up to 10 playlists for this song. You can select up to 10 playlists daily.

id="pageMessages">
[i][/i]
0 playlists selected from limit of 10






Cover
Details
Saves
Songs
Updated
Select




[i]

Contemporary Piano

by [url=#]antonioromopiano[/url]

Submissions: 1,013 | Approval rate: 43%

neo-classical · instrumental · cinematic · calming


539 [/i]
150 [i][/i]
2023 05 27





...  many rows like the one above ...




Done Selecting Playlists




< /code>
И это мой javascript: < /p>


$(document).ready(function () {
$("input[id^='checkpoint']").change(function () {
const checkbox_limit = 10;
const checkboxes = document.querySelectorAll('input[type="checkbox"]');

var element = document.getElementById("pageMessages");
var $table = $('#basic-1').dataTable();
var allNodes = $table.fnGetNodes();
var total_checked = 0;

$(allNodes).each(function () {
$(this).change(updatetotal_checked);
});

updatetotal_checked();

function updatetotal_checked () {

total_checked = $(allNodes).find("input[name='checkpoints']:checked").length;

$("#total_checked").text(total_checked);
if (total_checked > 0) {
$("#status").toggle(total_checked > 0);
}

};

/* Disable unchecked checkboxes if total checked = 10 */
checkboxes.forEach((checkbox) => {
checkbox.disabled = total_checked >= checkbox_limit && !checkbox.checked;
});

/* Disable submit button if at least one playlist hasn't been selected */
if (total_checked == 0) {
document.getElementById('done_selecting').setAttribute('disabled', '');
}
else {
document.getElementById('done_selecting').removeAttribute('disabled');
}

/* Change alert color if total checked = 10 */
if (total_checked >= checkbox_limit) {
element.classList.remove("alert-warning");
element.classList.add("alert-danger");
} else {
element.classList.remove("alert-danger");
element.classList.add("alert-warning");
}

/* Update alert text with total checked */
const limitCounter = document.getElementById('limitCounter');
limitCounter.textContent = `${total_checked} playlists selected from limit of ${checkbox_limit}`;

});

/* To set initial state */
$("input[id^='checkpoint']").trigger('change');

});

Любая помощь очень ценится!

Подробнее здесь: https://stackoverflow.com/questions/794 ... cked-limit