Formit добавить класс при ошибки при валидации для радиокнопок

Здравствуйте!
Есть некая форма с группами радиокнопок. Каждая группа кнопок обязательна для заполнения.
<form action="" method="post" id="anketa4" class="ajax_form">
	<div class="form-group">
		<fieldset>
			<legend>Вопрос-1 [[!+fi.error.question1]]</legend>
			<label for="q4-1-0"><input id="q4-1-0" type="hidden" name="question1[]" value=""  class="form-control" /></li>
			<label for="q4-1-1"><input type="radio" id="q4-1-1" name="question1[]" value="Ответ1" [[!+fi.question1:FormItIsChecked=`Ответ1`]] class="form-control"><span>Ответ1</span></label>
			<label for="q4-1-2"><input type="radio" id="q4-1-2" name="question1[]" value="Ответ2" [[!+fi.question1:FormItIsChecked=`Ответ2`]] class="form-control"><span>Ответ2</span></label>
			<label for="q4-1-3"><input type="radio" id="q4-1-3" name="question1[]" value="Ответ3" [[!+fi.question1:FormItIsChecked=`Ответ3`]] class="form-control"><span>Ответ3</span></label>
		</fieldset>
	</div>
	<div class="form-group">
		<fieldset>
			<legend>Вопрос-2 [[!+fi.error.question2]]</legend>
			<label for="q4-2-0"><input id="q4-2-0" type="hidden" name="question2[]" value=""  class="form-control" /></li>
			<label for="q4-2-1"><input type="radio" id="q4-2-1" name="question2[]" value="Ответ1" [[!+fi.question1:FormItIsChecked=`Ответ1`]] class="form-control"><span>Ответ1</span></label>
			<label for="q4-2-2"><input type="radio" id="q4-2-2" name="question2[]" value="Ответ2" [[!+fi.question1:FormItIsChecked=`Ответ2`]] class="form-control"><span>Ответ2</span></label>
		</fieldset>
	</div>
	<div class="form-group">
		<div class="controls">
			<button type="submit" class="submit-btn" value="Submit">Отправить</button>
		</div>
	</div>
</form>
Вызов формы:
[[!AjaxForm? 
  &form=`AjaxForm.anketa4` 
  &snippet=`FormIt` 
  &hooks=`FormItSaveForm,email`
  &emailTo=`[[++myemail]]`
  &emailFrom=`noreply@[[!getDomainName?&url=`[[++site_url]]`]]`
  &emailFromName=`[[++site_name]]`
  &emailSubject=`Анкета с сайта [[++site_name]]`
  &emailTpl=`tpl.email-anketa4`
 &validate=`tel:required,question1:required,question2:required`
  &validationErrorMessage=`Вы должны ответить на все вопросы в анкете!`
  &successMessage=`Анкета успешно отправлена`
 ]]
Formit позволяет делать валидацию радиокнопок, но почему-то не добавляет никаких классов к незаполненым группам, что бы можно было их как-то «подсветить» через css… Что делать?!
Игорь
01 июня 2019, 18:10
modx.pro
688
0

Комментарии: 4

Баха Волков
02 июня 2019, 12:44
0
Дописать или переписать js скрипт AjaxForm
    Игорь
    02 июня 2019, 14:45
    0
    пытаюсь, по аналогии с другими импутами дописать
    $().each(function(){
    var item = $(this),
    btn = item.find('.submit-btn');
    item.find('input[type=radio]').each(function(){
    if($(this).is(':checked')){
    // Если поле не пустое удаляем класс-указание
    $(this).removeClass('error');
    } else {
    // Если поле пустое добавляем класс-указание
    $(this).addClass('error');
    $(this).parent('.form-group').find('.error-message').show();
    }
    });
    }
    btn.click(function(){
    checkInput();
    });
    });
    но что-то не получается… понимаю, что туплю, но с js не особо дружу
      Игорь
      02 июня 2019, 15:17
      0
      т.е. здесь он проверяет у меня все радиокнопки, а мне же надо группы проверить (что бы одна кнопка в каждой группе была выбрана)… (
        Игорь
        03 июня 2019, 16:59
        0
        в общем я разобрался (вернее мне помогли на другом форуме), спасибо за вашу отзывчивость…
        $(function() {
        	$(".submit-btn").click(function() {
        		$("fieldset", this.form).each(function() {
        			$(this).toggleClass("err", !$("input", this).is(":checked"));
        		});
        
        		return $(this.form).find('.err:visible').length === 0;
        	});
        });
    Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
    4