Телефон помощника формы начальной загрузки не будет работать

Question

Я пытаюсь сделать сайт, используя форму Bootstrap Framework. Как часть моего кода у меня есть

<div class="control-group">
<label class="control-label" for="inputTell">Telephone</label>
<div class="controls">
<input type="text" id="inputTell" class="bfh-phone" data-format="(ddd) ddd-dddd">
</div>
</div>

Это изображение:

Так не должно быть. Он не должен принимать какие-либо строки, и он должен дать мне формат телефона, как это:

У меня уже есть необходимые файлы JS в моем каталоге, но я не уверен, почему он не работает.

Answer 1

Убедитесь, что поле ввода находится внутри формы. В противном случае телефонный помощник не будет работать правильно.

<form>
  <div class="control-group">
    <label class="control-label" for="inputTell">Telephone</label>
    <div class="controls">
      <input type="text" id="inputTell" class="bfh-phone" data-format="(ddd) ddd-dddd">
    </div>
  </div>
</form>

Пример jsfiddle

Answer 2

Кроме того, тип ввода должен быть "текст" или "тел" для работы помощников по формам:

часть фрагмента из файла bootstrap-formhelpers.min.js:

    ... ('form input[type="text"].bfh-phone, 
          form input[type="tel"].bfh-phone, span.bfh-phone').each(function(){
     ... 
 }); 

может быть полезным для кого-то

Answer 3

Ты забыл добавить <form> тег.

просто поместите свой код внутри <form> тег, и он начнет работать.

<form>

    <input type="text" id="inputTell" class="bfh-phone" data-format="(ddd) ddd-dddd">

</form>

Примечание: также добавьте необходимые классы начальной загрузки, такие как элементы управления, формы и т. Д.

Answer 4

Я пытаюсь использовать тип тел и другой класс

<div class="control-group">
   <input type="tel" class="form-control bfh-phone" data-format="(ddd) ddd-dddd" name="number" required>
</div>