2

форма на сайте состоит из 2-х полей.

  1. выбор формы оплаты
  2. ввод номера телефона или номер электронного кошелька.

пункт первый отрабатывается, значения value получил. а вот как в зависимости от value 1-пункта изменить регулярку во втором поле?

1-е поле

<select id="pay_method" required style="background-color:#343639" type="text" name="pay_method" class="form-control" >
                <option value="zz"></option>
                <option value="phone">На телефон</option>
                <option value="webmoney">На Webmoney (WMR)</option>
                </select>

2-е поле.

<input id="where_to_pay" required pattern="[0-9]{10}" type="text" placeholder="телеф. номер или руб. кошелек" name="where_to_pay" type="text" class="form-control"><span class="input-group-btn">

[0-9]{10} вот эту. если value из первого поля phone то [0-9]{10}, а если webmoney то [0-9]{12}


<div class="col-md-8 col-md-offset-2">
                
                <p class="text-lead">Выберите, как Вы хотите получить заработанные деньги</p>
				<p>На балланс телефона или на рублевый (R) кошелек WebMoney</p>
				<p>Введите номер рублевого кошелька WebMoney без  R, или</p>
				<p>Телефонный номер только 10 цифр без 7,+7,8 </p>
	
                <form role="form" method="POST" action="check.php">
                  <div class="input-group input-group-lg">
 <select id="pay_method" required name="pay_method" class="form-control">
      <option value="">Выбрать</option>
      <option value="phone" data-pattern="[0-9]{10}">На телефон</option>
      <option value="webmoney" data-pattern="[0-9]{12}">На Webmoney (WMR)</option>
    </select>

    <input id="where_to_pay" required pattern="[0-9]{10}" 
           type="text" placeholder="телеф. номер или руб. кошелек"
           name="where_to_pay" type="text" class="form-control">
    
    <span class="input-group-btn">
      <input type="submit" class="btn btn-primary">
    </span>

  </div>
  
  <br>
  <b>Паттерн:</b> <code class="pattern">[0-9]{10}</code>
</form>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
var $select = $('select#pay_method');
var $input = $('input#where_to_pay');
var $pattern = $('.pattern');

$select.change(function() {
  var value = $(this).val(),
    pattern = $(this).find('option').filter('[value="' + value + '"]').data('pattern');
  console.log('change', pattern);
  $input.attr('pattern', pattern);
  $pattern.text(pattern);
});

</script>			
              </div>

проверил на чистом листике)) html - работает ((

1 ответ 1

1

Для изменения аттрибута у <input pattern="..."> добавьте поле data-pattern у каждого элемента выпадающего списка и считывайте его при выборе нового значения у <select>

<form role="form">

  <div class="input-group">

    <select id="pay_method" required name="pay_method" class="form-control">
      <option value="">Выбрать</option>
      <option value="zz" data-pattern="[0-9]{9}">zz</option>
      <option value="phone" data-pattern="[0-9]{10}">На телефон</option>
      <option value="webmoney" data-pattern="[0-9]{12}">На Webmoney (WMR)</option>
    </select>

    <input id="where_to_pay" required pattern="[0-9]{10}"
           type="text" placeholder="телеф. номер или руб. кошелек"
           name="where_to_pay" type="text" class="form-control">

    <span class="input-group-btn">
      <input type="submit" class="btn btn-primary">
    </span>

  </div>

  <br>
  <b>Паттерн:</b> <code class="pattern">[0-9]{9}</code>
</form>

Рабочий пример тут https://codepen.io/lukas-pierce/pen/LxoxXb

4
  • 1
    в рабочем примере срабатывает, у меня на сайте нет- все перепроверил((
    – Дик
    17 фев 2017 в 19:02
  • добавь свой код, разберем ) 17 фев 2017 в 19:03
  • 1
    добавил но как-то коряво, вверху он теперь((
    – Дик
    17 фев 2017 в 19:40
  • Елки-моталки, (это если без нецензурной лексики) :) Lukas Pierce, спасибо, все работает! Это я - тупень, долго разбирался,но нашел. Был прикреплен js скрипт, который не давал работать коду. Убрал - все ОК!))
    – Дик
    19 фев 2017 в 11:44

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.