Как правильно закончить цикл?

Question

[Alex Goncharov]

Нужно, чтобы по нажатию на кнопку проверялось заполнено ли поле, и если заполнено - то выполнять перенаправление на страницу спасибо. Если нет, то подсвечивать поле. Не разберусь(

function goToURL() {
        
 
    $('form-contact"').submit(function() {
var faults = $('input').filter(function() {
    // находим не заполненные обязательные элементы input
    return $(this).data('required') && $(this).val() === "";
}).css("background-color", "red"); // выделяем это поле красным
    if(faults.length) return false; // если одно из полей не заполнено, отменяем отправку
});    
        
        else{
            
             location.href = '/qtnx';
        }
     

    }

<form id="form-contact" method="POST" class="form-element" autocomplete="off">


          <input name="phone" required type="tel" class="form-input__phone" tabindex="0"  placeholder="[phone]" >
          <input name="theme" type="hidden" class="form-input__theme"  value="">
          <input onclick="goToURL();" type="submit" class="form-input__button" value="Отправить в WhatsApp">
      </form>

Comments

[Alex]

Был бы код нормально отформатирован, его было бы проще прочитать. И, глядишь, кто-то быстрее и ответит

Answer 1

[M-ka]

action формы на урл(если нужно все же отправить инфу по урл), а в сабмит тру фолс по результату выполнения проверки сереалайза формы на пустые значения ключей

Answer 2

[Максим]

function goToURL() {
	
	let fault = $('input[required]');
	
	for (let i = 0; i < fault.length; i++) {
		if (($(fault)[i]).value === '') {
			$((fault)[i]).css("background", "red");
		} else {
			location.href = '/qtnx'
		}
	}
}

Answer 3

[Bowen]

Как вариант:

<form class="form-element"
      method="POST"
      autocomplete="off">

  <input class="form-input__phone"
         type="tel"
         name="phone"
         tabindex="0"
         placeholder="[phone]">

  <input class="form-input__theme"
         type="hidden"
         name="theme">

  <button class="form-input__button"
          type="submit">Отправить в WhatsApp</button>
</form>

$('.form-element').on('submit', (e) => {
  e.preventDefault();

  let faults = 0;

  $('.form-input__phone', e.target).each((index, input) => {
    let isEmpty = !input.value;
    faults += isEmpty;
    $(input).toggleClass('isEmpty', isEmpty);
  });
  
  return faults ? false : window.location.replace("/page");
});