Как сделать кнопку неактивной пока не заполнены поля и не отмечены чекбоксы?

Question

[karelina-nat]

Есть вот такая форма

Мне нужно, чтобы кнопка "отправить" была неактивна, пока не будут заполнены все поля по условию, не отмечена галочка "согласен", и не отмечен один из двух верхних чекбоксов. Отдельно у меня работает проверка полей, и проверка чекбокса согласия. Как совместить это всё в одну конструкцию

Answer 1

[twobomb]

Ну добавь все проверки в свой checkParams, и повесь на чекбоксы onchange="checkParams()"

function checkParams() {
            var name = $('#name').val();
            var email = $('#email').val();
            var phone = $('#phone').val();
            if(name.length != 0 && email.length != 0 && phone.length != 0 && $('#personaldata').prop("checked") && ($('#cakecheck').prop("checked") || $('#drinkcheck').prop("checked")))
                $('#submit').removeAttr('disabled');
             else 
                $('#submit').attr('disabled', 'disabled');
        }

Answer 2

[Tim]

примерно так можно

Answer 3

[Spartak (Web-StyleStudio)]

Script

function checkParams() {
	var name = $.trim($('#name').val());
	var email = $.trim($('#email').val());
	var phone = $.trim($('#phone').val());
	var checkbox1 = $('#cakecheck').prop('checked');
	var checkbox2 = $('#drinkcheck').prop('checked');
	var checkbox3 = $('#personaldata').prop('checked');

	if (checkbox1 && checkbox2 && checkbox3 && name.length > 0 && email.length > 0 && phone.length > 0) {
		$('#submit').prop('disabled', false);
	} else {
		$('#submit').prop('disabled', true);
	}
}

HTML

<form method="post" action="" id="forma" name="">
	<div class="loyalty-form__checkboxes">
		<div class="loyalty-form__checkbox">
			<img class="loyalty-form__checkbox-img" src="<?php echo get_template_directory_uri() ?>/assets/images/static/checkcake.png" alt="">
			<input type="checkbox" class="loyalty-form__checkbox-style" name="cake" id="cakecheck" onchange="checkParams()" required>
			<label class="loyalty-form__checkbox-text" for="cakecheck">Хочу скидку на тортики <span class="loyalty-form__pink">*</span></label>
		</div>
		<div class="loyalty-form__checkbox">
			<img class="loyalty-form__checkbox-img" src="<?php echo get_template_directory_uri() ?>/assets/images/static/checkdrink.png" alt="">
			<input type="checkbox" class="loyalty-form__checkbox-style" name="drink" id="drinkcheck" onchange="checkParams()" required>
			<label class="loyalty-form__checkbox-text" for="drinkcheck">Очень люблю кофе, хочу скидку <span class="loyalty-form__pink">*</span</label>
		</div>
	</div>
	<input id="name" oninput="checkParams()" class="form-element" type="text" placeholder="Введите имя" autocomplete="off" required /><br>
	<input id="email" oninput="checkParams()" class="form-element" type="email" placeholder="Введите e-mail" autocomplete="off" required /><br />
	<input id="phone" oninput="checkParams()" class="form-element" type="tel" placeholder="Введите телефон" autocomplete="off" required/><br />
	<input type="button" id="submit" value="Отправить" disabled>
	<input type="checkbox" name="check" id="personaldata" onchange="checkParams()" required>
	<label for="personaldata">Согласен(а) на обработку моих персональных данных</label>
</form>