Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 13.10.2016, 11:58
Новичок на форуме
Отправить личное сообщение для Nikita21 Посмотреть профиль Найти все сообщения от Nikita21
 
Регистрация: 28.07.2016
Сообщений: 9

Jquery validation если заполнено одно из полей
Хотел сделать форму, которая проверяет три поля, одно постоянно, а два других, только если они не заполнены.
При этом если заполнено mail ИЛИ phone, то форма отправляется. При этом на поле phone стоит маска. Кто знает как решить?
<form id="form_mid" class="big_form" action="php/send.php" method="post" novalidate="novalidate">
					
					<div class="form_mid_label">Напишите сферу вашего бизнеса</div>
					<input type="text" name="salon" placeholder="например,  автосалон">
					
					<div class="form_mid_label">Напишите ваш сайт, если есть</div>
					<input type="text" name="site" placeholder="например,  mazzmedia.ru">
					
					<div class="form_mid_label">Укажите имеющийся бюджет на тест</div>
					<input type="text" name="budjet" placeholder="например, 7000 руб">
					
					<div class="form_mid_label">Ваше имя</div>
                    <input type="text" name="name" placeholder="">
					
					<div class="form_mid_label mail">E-mail, если есть</div>
                    <input type="text" name="email" placeholder="например,  info@mazzmedia.ru">
					
					<div class="form_mid_label phone">Контактный номер</div>
					<input type="text" name="phone" placeholder="+7 (___) ___-__-__">
					
                    <button>ОТПРАВИТЬ</button>
                </form>

$("#form_mid").validate({
		rules: {
			budjet: {required: true},
			phone: {required: true},
			email: {required: false, email: true}
		},	
		messages: {
			budjet: {required: false},
			phone: {required: false, phone: false},
			email: {required: false, email: false}
		},
		submitHandler: function(form) {
			sendForm(form);
		}
	});



Сам я пробовал решить таким способом, но не получилось:

$("#form_mid button").click(function(){
	if ($("#form_mid input[name='email']").val == ""){
	$("#form_mid").validate({
		rules: {
			budjet: {required: true},
			phone: {required: true},
			email: {required: false, email: true}
		},	
		
		messages: {
			budjet: {required: false},
			phone: {required: false, phone: false},
			email: {required: false, email: false}
		},
		submitHandler: function(form) {
			sendForm(form);
		}
	});
	}
	else if ($("#form_mid input[name='email']").val != ""){
	$("#form_mid").validate({
		rules: {
			budjet: {required: true},
			phone: {required: false},
			email: {required: true, email: true}
		},	
		
		messages: {
			budjet: {required: false},
			phone: {required: false, phone: false},
			email: {required: false, email: false}
		},
		submitHandler: function(form) {
			sendForm(form);
		}
	});
	}	
	});
Ответить с цитированием
  #2 (permalink)  
Старый 13.10.2016, 12:24
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Сообщение от Nikita21
$("#form_mid input[name='email']").val()
красное нужно -- но в целом код не рабочий, нужно отменить всплытие, и не знаю сработает ли смена правил
Ответить с цитированием
  #3 (permalink)  
Старый 13.10.2016, 12:34
Новичок на форуме
Отправить личное сообщение для Nikita21 Посмотреть профиль Найти все сообщения от Nikita21
 
Регистрация: 28.07.2016
Сообщений: 9

Скобки были, это я по памяти писал, забыл)
В целом неправильно наверно)
Ответить с цитированием
  #4 (permalink)  
Старый 13.10.2016, 12:40
Профессор
Отправить личное сообщение для warren buffet Посмотреть профиль Найти все сообщения от warren buffet
 
Регистрация: 08.07.2016
Сообщений: 1,332

Сообщение от Nikita21
budjet: {required: true}
Это сразу в инпут пиши

<input type="text" name="budjet" required="required" placeholder="например, 7000 руб">


Ну и все остальное, что может быть полезным - в атрибуты. Потом просто берешь элемент и проверяешь все ли соответствует.
Ответить с цитированием
  #5 (permalink)  
Старый 13.10.2016, 12:42
Профессор
Отправить личное сообщение для warren buffet Посмотреть профиль Найти все сообщения от warren buffet
 
Регистрация: 08.07.2016
Сообщений: 1,332

Если забить на правильность, в required можно записать минимальную длину, например required="3" - минимум 3 букавы. А если юзать pattern, туда вообще почти все можно запихать.
Ответить с цитированием
  #6 (permalink)  
Старый 13.10.2016, 12:55
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

validate добавление своего метода и выбор заполнения одного поля из двух
Nikita21,
вариант ... маску и length > 3 сами добавьте
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
</script>
  <style type="text/css">
  label.error {
    position: absolute;
    margin-left: 12px;
  }

  </style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/jquery.validate.min.js"></script>
  <script>

$(function () {
$.validator.addMethod("requiredphone", function (value, element) {
        return value.length || $.trim($('[name="email"]').val());
    },
    " Заполните это поле!!!");
$.validator.addMethod("requiredemail", function (value, element) {
        return value.length || $.trim($('[name="phone"]').val());
    },
    " Заполните это поле!!!");

 $("#form_mid").validate({
    rules: {
      budjet: {required: true},
      phone: {requiredphone: true},
      email: {requiredemail: true}
    },
    submitHandler: function(form) {
      sendForm(form);
    }
  });


});
  </script>
</head>
<body>
<form id="form_mid" class="big_form" action="php/send.php" method="post" novalidate="novalidate">

          <div class="form_mid_label">Напишите сферу вашего бизнеса</div>
          <input type="text" name="salon" placeholder="например,  автосалон">

          <div class="form_mid_label">Напишите ваш сайт, если есть</div>
          <input type="text" name="site" placeholder="например,  mazzmedia.ru">

          <div class="form_mid_label">Укажите имеющийся бюджет на тест</div>
          <input type="text" name="budjet" placeholder="например, 7000 руб">

          <div class="form_mid_label">Ваше имя</div>
                    <input type="text" name="name" placeholder="">

          <div class="form_mid_label mail">E-mail, если есть</div>
                    <input type="text" name="email" placeholder="например,  info@mazzmedia.ru">

          <div class="form_mid_label phone">Контактный номер</div>
          <input type="text" name="phone" placeholder="+7 (___) ___-__-__">
          <br>
                    <button>ОТПРАВИТЬ</button>
</form>

</center>

</body>
</html>
Ответить с цитированием
  #7 (permalink)  
Старый 13.10.2016, 13:37
Новичок на форуме
Отправить личное сообщение для Nikita21 Посмотреть профиль Найти все сообщения от Nikita21
 
Регистрация: 28.07.2016
Сообщений: 9

Видел подобное решение в статье, переведенной через гугл, ниче не понял)

Спасибо большое, все работает. =)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Добавление из нескольких полей в одно bohdantheone Общие вопросы Javascript 12 08.10.2013 13:32
jquery validation form - событие окончания отправки Porolon AJAX и COMET 2 10.09.2011 00:56
hide() и show() в jQuery antserg jQuery 1 15.07.2011 18:23
Jquery событие если сделан клик за елементом! shureg Библиотеки/Тулкиты/Фреймворки 1 07.05.2011 20:03
JQuery плагин Validation. Переопределение правил валидации формы. Виталик jQuery 3 07.06.2009 13:32