Bootstrap Modal появляется без проверки

У меня есть форма, в которой мне нужно сначала проверить форму, а затем, когда я нажимаю кнопку книги, должно появиться модальное окно с сообщением подтверждения
Это код кнопки:

<button type="submit" class="btn btn-info btn-lg custom" data-toggle="modal" data-target="#book-modal"> BOOK </button>

Однако, хотя я подтвердил ввод, используя «обязательно», но он не работает, и модальное окно появляется без ввода каких-либо данных.

<input id="place" name="place" type="text" class="form-control my-size"  placeholder="Enter the place" maxlength="100" required>

twitter-bootstrap bootstrap-modal
person rahul sinha    schedule 30.07.2015    source источник

Ответы (1)


arrow_upward
0
arrow_downward

На самом деле у вас нет связи между вашей кнопкой и текстовым вводом, вам может понадобиться функция jquery, которая запускается при изменении текстового ввода, где она проверяет правильность ввода (checkValidity) и запускает модальное окно, если ввод действителен:

$("#place").change(function(){

   if($(this)[0].checkValidity()) // <<<< check for validity of the DOM element, thats why we use [0]
   {

      $('#book-modal').modal(); // if so run the modal window      
   } 
});
person KAD    schedule 30.07.2015
comment
Он не работает, по-прежнему появляется модальное окно, когда я нажимаю кнопку книги. Я попробовал его после удаления data-toggle=modal data-target=#book-modal из кнопки, но он отправляет только форму. Тогда модальное окно не всплывает - person rahul sinha; 31.07.2015
comment
Я разместил здесь, пожалуйста, проверьте stackoverflow.com /вопросы/31749560/ - person rahul sinha; 31.07.2015