Jump to content
  • 0

Связанные поля jQuery Validation Plugin


Shiza
 Share

Question

Есть некая форма которая валидируется при помощи этого плагина https://github.com/jzaefferer/jquery-validation

В ней есть два поля email и телефон. Важно уточнение поле телефон вводится по маске и имеет тип "tel".

Нужно сделать так, чтоб если набрано одно из них, то второе становилось необязательным для валидации (required: false), а это набранное поле валидировалось согласно своим правилам.

Сама форма вот https://jsfiddle.net/1h34vy1r/

 

Edited by Shiza
Link to comment
Share on other sites

5 answers to this question

Recommended Posts

  • 0
6 минут назад, wwt сказал:

сделайте одно поле, напишите "введите ваш телефон или email" и сделайте валидацию этого комбинированную, вот и все.

Нельзя. Поле телефон вводится по маске и имеет тип "tel".

Link to comment
Share on other sites

  • 0
4 часа назад, by chris сказал:

конкретизируйте

Для отправки поля достаточно только одного из этим полей. Набрали email телефон стал необязательным. Если же набрали телефон то emial становится необязательным. То есть мы может набрать хоть оба поля стразу, хоть любое на выбор, но совсем не заполнять мы не можем.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

  • Similar Content

    • By Gora
      Доброго времени суток, при написании одного из макетов встала проблема, нужно связать форму input с кнопкой, то есть задав параметр ввода через pattern="[a-z]{1,26}".
      Нужно сделать так чтобы при неправельно заполнены форме кнопка было не активной.
      <h2>Введіть Ключ</h2> <input id="key" class="form-control" pattern="[a-z]{1,26}" value="key" placeholder="Писати сюди"> <h2>Введіть слово</h2> <input id="slov" class="form-control" pattern="[a-z]{1,26}" value="hello" placeholder="Писати сюди"> <input class="btn btn-block btn-success" value="Закодувати" onclick="zakoduvaty5(this);" type="submit"> <h2>Закодоване слово</h2> <input class="form-control" id="zakodslov" readonly> <h2>Введіть код</h2> <input id="zakodslovo" class="form-control" pattern="[0-9 ]{1,50}" placeholder="Писати сюди"> <input class="btn btn-block btn-success" value="Розкодувати" onclick="rozkoduvaty5(this);" type="submit"> <h2>Розкодоване слово</h2> <input class="form-control" id="rez" readonly>
      примерно так это должно выглядеть, чуть не забыл 1 и 2 форма должны быть связаны.
      Благодарю за внимание, Всего самого лучшего вам.
    • By mrvelan
      Добрый день! Помогите, пожалуйста, мне нужно сделать так, что-бы форма не отправлялась мне на мыло пустая, а чтоб проверялась на пустоту...
       
      <div id="order" class="popup">
              <a href="#" onclick="cart.closeWindow('order', 0)" style="float:right">[Закрыть]</a>
              <h4>Введите данные</h4>
              <form id="formToSend">
                  <input id="fio" type="text" placeholder="Имя"  class="text-input" />
                  <input id="city" type="text" placeholder="Район Риги"  class="text-input"/>
                  <input id="phone" type="text" placeholder="Контактный телефон" class="text-input"/>
                  <input id="email" type="text" placeholder="Э-почта" class="text-input" />
                  <input id="inf" type="text" placeholder="Дополнительная информация" class="text-input" />
                  <br>
                      <textarea id="question" placeholder="Адрес доставки"></textarea>
                  <br>
                  <b>Доставка:</b>
                  <br>
                  <select id="delivery">
                      <option value="-">-</option>
                      <option value="С доставкой">ДА. Доставка нужна</option>
                      <option value="Доставка НЕ нужна">НЕТ. Доставка не нужна</option>
                  </select>
              </form>
                  <button class="bbutton" onclick="cart.sendOrder('formToSend,overflw,bsum');">Заказать</button>
          </div>
    • By Алексей8888
      Добрый День.
      Такой Вопрос, если есть возможность, помогите, кто сталкивался с подобной Темой.
      Есть форма отправки информации (Имя, Е-мэйл, Телефон, Описание)
      После заполнения формы, нажав на Отправить, инфо отправляесься на Сервер, храниться там. На сервере создал
      файл post.php
      Вопрос заключаеться в следующем:
      Что нужно прописать в скрипте чтобы заполненная форма номер 1 автоматически отправлялась на емэйл
      следующему человеку заполнившему следующим ту же форму?
      Выглядит так: 
      Первый человек заполняет форму, она посылается на сервер и сохраняется в файле. Следующий человек получает на емейл содержимое файла, после чего файл переписывается.
      И так далее, каждый заполнивший форму Автоматически получает информацию предыдущего посетителя.
      Буду Благодарен за любую информацию.
      С Уважением
      Спасибо
    • By biper
      в форме размещения объявления пытаюсь вывести
      1. количество знаков в объявлении,
      2. стоимость одного объявления (= стоимости одного знака, в зависимости от выбранного типа объявления * количество знаков), 
      3. общую сумму заказа (= количество публикаций (выбирается из календаря) * стоимость одного объявления -
      скидка в 7% если выбрано 4 или более публикаций) 
      4. Размер скидки в рублях (= 7% от суммы заказа)
      количество знаков подсчитывает, в отдельный див вывел без труда... есть уже календарь, который даты публикации передает...  Дальше почему то затык...что делаю не так? не могу посчитать и вывести ....
      5. Кроме того, нужно в поле «Текст объявления», заполняемого пользователем… выводить внешний вид
      объявления –  т. е.  Class для div внешний вид для текста объявления, набираемого пользователем в
      соответствующем поле должен меняться в зависимости от выбранного типа объявления. Т.е. если выбран тип выделение полем, то текст должен с помощью стиля отображаться с фоновым цветом вокруг текста, если выбран тип «в рамке» - текст должен отображаться внутри рамки
      Окончательно расписался в собственной безграмотности и готов оплатить работу знающего человека. Оплата по факту на карточку или еще куда. Интересует на этом этапе  цена вопроса 
      Саму страничку можно посмотреть по адресу http://modx.biper3fo.bget.ru/prajs-list.htmlна вкладке "РАЗМЕЩЕНИЕ СТРОЧНЫХ ОБЪЯВЛЕНИЙ"

      код странички - все вместе, со скриптом..
       
      <div id="respond"> <form method="post" action="[~[*id*]~]"> <input type="hidden" name="formid" value="contact-form" /> <img src="/image/shadow.png" alt="тень" "width="100%" "> <h2>электронная форма размещения объявлений</h2><hr> <p><b>Для уточнения возникших у Вас вопросов и для консультации Вы можете связаться с сотрудником редакции по многоканальному телефону, указанному в шапке сайта или воспользоваться офлайн контактной формой "Перезвоним" в правом нижнем углу экрана</b></p> <hr> <div class="col-sm-6"> <p><label accesskey="n" for="name">Ваше имя (например "Александр Иванов")</label> </div> <div class="col-sm-6"> <input type="text" name="name" size="50%" maxlength="100%" eform="Имя::1" /></p> </div> <div class="col-sm-6"> <p><label accesskey="e" for="email">Адрес Вашей электронной почты (например "post@mail.ru")</label> </div> <div class="col-sm-6"> <input type="text" name="email" size="50%" maxlength="100%" eform="Адрес электронной почты:email:1" /></p> </div> <div class="col-sm-6"> <p><label accesskey="p" for="phone">Ваш мобильный телефон (на сайте не публикуется). Необходим для того, чтобы идентифицировать Ваш заказ. Этот же номер Вам понадобится при оплате услуги на терминале. (например "8 929 001 22 34")</label> </div> <div class="col-sm-6"> <input type="text" name="phone" size="50%" maxlength="100%" eform="Ваш мобильный телефон::1" /></p> </div> <div class="col-sm-6"> <p><label accesskey="s" for="otdel">Выберите раздел газеты</label> </div> <div class="col-sm-6"> <select name="otdel" > <option value="&&& Недвижимость">Объявление в раздел Недвижимость</option> <option value="&&& Дачное строительство">Объявление в раздел Дачное строительство</option> <option value="&&& Ремонт квартир">Объявление в раздел Ремонт квартир</option> <option value="&&& Балконы, окна">Объявление в раздел Балконы, окна</option> <option value="&&&Электротехнические работы">Объявление в раздел Электротехнические работы </option> <option value="&&& Сантехника">Объявление в раздел Сантехника</option> <option value="&&& Двери, металлоконструкции">Объявление в раздел Двери, металлоконструкции</option> <option value="&&& Замки">Объявление в раздел Замки</option> <option value="&&& Межкомнатные двери">Объявление в раздел Межкомнатные двери</option> <option value="&&& Мебель, интерьер">Объявление в раздел Мебель, интерьер</option> <option value="&&& Ремонт бытовой техники">Объявление в раздел Ремонт бытовой техники</option> <option value="&&& Ремонт компьютеров">Объявление в раздел Ремонт компьютеров</option> <option value="&&& Ремонт телевизоров">Объявление в раздел Ремонт телевизоров</option> <option value="&&& Антенны">Объявление в раздел Антенны</option> <option value="&&& Грузоперевозки">Объявление в раздел Грузоперевозки</option> <option value="&&& Куплю">Объявление в раздел Куплю</option> <option value="&&& Продаю">Объявление в раздел Продаю </option> <option value="&&& Займы">Объявление в раздел Займы</option> <option value="&&& Разное">Объявление в раздел Разное</option> <option value="&&& Ветеринарные услуги">Объявление в раздел Ветеринарные услуги</option> <option value="&&& Ритуальные услуги">Объявление в раздел Ритуальные услуги</option> <option value="&&& Брачные знакомства">Объявление в раздел Брачные знакомства</option> <option value="&&& Магия">Объявление в раздел Магия</option> <option value="&&& Вакансии">Объявление в раздел Вакансии</option> <option value="&&& Услуги автомобилистам">Объявление в раздел Услуги автомобилистам</option> <option value="&&& Выкуп авто">Объявление в раздел Выкуп авто</option> <option value="&&& Химчистка">Объявление в раздел Химчистка</option> <option value="&&& Клининг">Объявление в раздел Клининг</option> <option value="&&& Вывоз мусора">Объявление в раздел Вывоз мусора</option> <option value="&&& Дезинсекция">Объявление в раздел Дезинсекция</option> <option value="&&& Организация праздника">Объявление в раздел Организация праздника</option> <option value="&&& Салон красоты">Объявление в раздел Салон красоты</option> <option value="&&& Арена Путешествий">Объявление в раздел Арена Путешествий</option> </select></p> </div> <div class="col-sm-6"> <label accesskey="t" for="type">Выберите тип публикации</type> <select name="type" id="type" onchange="changePrice()"> <option value="без выделения">без выделения</option> <option value="выделение фоном">с фоном</option> <option value="объявление в рамке">в рамке</option> </select> </label> </div> <div class="col-sm-6"> <p><label accesskey="c" for="comments">Наберите текст объявления,- так, как он должен будет выглядеть в газете (для экономии денег :) возможны сокращения. Обязательно укажите контактный телефон (который может отличаться от указанного выше.) Например "Мет. двери, реш., ворота. Т. 414-74-66")</label> <br/></p> <h2>Ваше объявление в газете будет выглядеть так:</h2> <!--в поле «Текст объявления», заполняемого пользователем… нужно выводить внешний вид объявления – т. е. текст, введенный пользователем в поле «текст объявления» должен отображаться с тем оформлением CSS-стиля который задан полем «тип выделения публикации»--> <div class="(type_aa)" style="font-size: 14px; color:gray;"> <textarea cols="50" rows="10" name="comments" eform="Текст объявления:html:1" onkeyup="symbols(this)" onkeydown="symbols(this)" onkeyup="changePrice()" onkeydown="changePrice()" id="textarea"></textarea></p> </div> <!-- количество знаков в объявлении --> <div id="symbols"></div> <!--стоимость одной публикации объявления в рублях (--> <div id="price">Стоимость одной публикации объявления в рублях</div> <!-- общая стоимость заказа в рублях --> <div id="resultat">Стоимость заказа в рублях</div> <!-- скидка в рублях --> <div id="skidka">Размер скидки в рублях</div> <div> </div> </div> <div class="col-sm-6"> <!-- дата публикации должна отображаться под конкретные даты корректировка. Должен выводить календарную сетку на текущий год, начиная с текущего месяца, На календарной сетке отображается выделением дата выхода номера газеты. Сии дни обычно приравнены к среде, потому может проще добавить условие - исключения, когда в определенные указанные дни даты переносятся--> <p><label accesskey="dat" for="dat">Дата выхода номера газеты, в котором Вы можете разместить свое объявление - среда, выделена в календаре подчеркиванием. Окончание приема рекламы в номер - 15-00 вторника той же недели. Выберите в календаре желаемую дату выхода (можно выбрать несколько номеров, при этом автоматически просчитанную стоимость Вашего объявления нужно будет умножить на количество публикаций) </label></p> </div> <div class="col-sm-6"> <input type="text" name="dat" size="50%" maxlength="100%" eform="Дата публикации::1" id="dt"/></p> </div> <div class="col-sm-12">[[calendar]]</div> <img src="/image/shadow.png" alt="тень" "width="100%" "> <div class="col-sm-12"> <div class="col-sm-3"> <p><input type="submit" name="submit" id="submit" class="btn btn-primary" value="Разместить объявление"></p> </div> <div class="col-sm-6"> <p><i>Нажимая на кнопку "Разместить объявление", Вы подтверждаете согласие с правилами, указанными в разделе <a href="http://arena-rv.ru/politika-konfidenczialnosti-sajta-arena.html">"Политика конфиденциальности сайта "Арена"</a> и даете согласие на обработку персональных данных, переданных Вами при размещении Вашего объявления</i></p> </div> </div> </form> <script type="text/javascript"> function symbols() { var symbols = textarea.value.length; document.getElementById('symbols').innerHTML = 'В Вашем объявлении <span class="red" style="font-size: 14px; color:red;">' + symbols + '</span> знаков.'; } function changePrice() { var price = document.getElementById('price'); var textarea = document.getElementById('textarea'); var pricei = document.getElementById('pricei'); var resultat = document.getElementById('resultat'); var skidka = document.getElementById('skidka'); if(type.value == 'простое') cena = 18; else if(type.value == 'с фоном') cena = 19; else cena = 24; price.innerHTML = cena * textarea.value.length; pricei.value = cena * textarea.value.length; document.getElementById('price').innerHTML = 'стоимость одной публикации' + price + 'руб.'; } var dt = document.getElementById('dt'); function setDate(d){ dt.value += (dt.value == '') ? d : ', '+d; } function init() { if (arguments.callee.done) return; arguments.callee.done = true; changePrice(); } // ff, opera if (document.addEventListener) { document.addEventListener("DOMContentLoaded", init, false); } // ie /*@cc_on @*/ /*@if (@_win32) document.write("<script id=__ie_onload defer src=javascript:void(0)>"); document.write("<\/script>"); var script = document.getElementById("__ie_onload"); script.onreadystatechange = function() { if (this.readyState == "complete") { init(); } }; /*@end @*/ // safari if (/WebKit/i.test(navigator.userAgent)) { var _timer = setInterval(function() { if (/loaded|complete/.test(document.readyState)) { clearInterval(_timer); delete _timer; init(); } }, 10); } // others window.onload = init; </script>  
    • By Hmayak
      Здравствуйте. У меня есть форма, который открывается в всплывающим окне (bootstrap). Так вот на iphone при клике на поле формы страница сайта прокручивается вверх. Подскажите пожалуйста как запретить эту прокрутку? Заранее спасибо.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy