Отмена обязательного атрибута checkbox'a формы при нажатии на submit формы

Рейтинг: 0Ответов: 2Опубликовано: 21.06.2023

В соответствии с ТЗ реализована такая ситуация: при отрисовке формы проверяется на "валидность" checkbox и в зависимости от этого происходит показ/скрытие поля.

/*Нажат чекбокс*/
#date2 {
    visibility: hidden;
}

/*НЕ нажат чекбокс*/
form:invalid #date2{
    visibility: visible;
}

сам чекбокс так прописан:

<input type="checkbox" name="iskCheck" id="iskChkId" class="isk_check"
<?php if (isset($_POST['iskCheck']) && $_POST['iskCheck'] === 'on')
echo 'checked'; ?> required >

Но расчет данных формы должен выполняться даже при отключенной галочке. Есть идея отменить у формы проверку на валидность в момент нажатия кнопки submit, что вроде этого:

<script>
    document.addEventListener('DOMContentLoaded', function() {
        document.getElementById('myForm').addEventListener('submit', function(event) {
            // Отменить действие по умолчанию (отправку формы)
            event.preventDefault();

            // Получить ссылку на чекбокс
            const checkbox = document.getElementById('iskChkId');

            // Проверить условия и отправить форму, только если условия выполняются
            if (!checkbox.checked) {
                checkbox.removeAttribute('required');
                document.getElementById('myForm').noValidate = true;
                // Отправить форму
                this.submit();
            }
        });
    });
</script>

или так

document.addEventListener('DOMContentLoaded', function() {
    document.getElementById('submitBtn').addEventListener('click', function(event) {
        // Отменить действие по умолчанию (отправку формы)
        event.preventDefault();

        // Получить ссылку на форму
        var form = document.getElementById('myForm');

        // Отключить проверку валидности формы
        form.noValidate = true;

        // Выполнить код при нажатии на кнопку
        // Независимо от состояния чекбокса
        // Ваш код здесь

        // Отправить форму на сервер
        form.submit();
    });
});

но так перестаёт работать кнопка вообще.

То есть мой вопрос такой: как при наличии условия поверки на валидность (то есть при НЕнажатой галочке) всё равно выполнять код отправки формы на сервер для расчёта?

Ответы

▲ 0

добавить

document.getElementById('submitBtn').addEventListener('click', function(event) {
    document.getElementById('myForm').noValidate = true;
});
▲ 0

Убери атрибут required из тега input