Почему Bootstrap Datepicker не перепроверить

**My HTML form is:** 

<html> 
    <body> 

    <form role="form" class="margin_top" method="post" id="eventForm"> 

      <div class="form-group"> 
        <div class="input-group date form_date col-sm-12" data-date="" data-date-format="dd MM yyyy" data-link-field="dtp_input2" data-link-format="yyyy-mm-dd" id="datePicker"> 
         <input class="form-control" size="16" type="text" value="" name="date_from" placeholder="Date of Arrival" readonly> 
         <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span> 
        </div> 
       </div> 
      <div class="form-group"> 
        <div class="input-group date form_date col-sm-12" data-date="" data-date-format="dd MM yyyy" data-link-field="dtp_input2" data-link-format="yyyy-mm-dd" id="datePicker2"> 
         <input class="form-control" size="16" type="text" value="" name="date_to" placeholder="Date of Departure" readonly> 

         <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span> 
        </div> 
        <input type="hidden" id="dtp_input2" value="" /> 
       </div> 
     <button type="submit" name="send_request" class="btn btn-info bnt-md" value="send">Send Request</button> 
    </form> 
    </body> 


    <script> 
    $(document).ready(function() { 
     $('#datePicker') 
      .datepicker({ 
       format: 'mm/dd/yyyy' 
      }) 
      .on('changeDate', function(e) { 
       // Revalidate the date field 
       $('#eventForm').formValidation('revalidateField', 'date_from'); 
     }); 
     $('#datePicker2') 
      .datepicker({ 
       format: 'mm/dd/yyyy' 
      }) 
      .on('changeDate', function(e) { 
       // Revalidate the date field 
       $('#eventForm').formValidation('revalidateField', 'date_to'); 
     }); 



     $('#eventForm').bootstrapValidator({ 
      feedbackIcons: { 
       valid: 'glyphicon glyphicon-ok', 
       invalid: 'glyphicon glyphicon-remove', 
       validating: 'glyphicon glyphicon-refresh' 
      }, 
      fields: { 
       date_from: { 
         validators: { 
          notEmpty: { 
          message: 'The date is required' 
         }, 
         date: { 
          format: 'MM/DD/YYYY', 
          message: 'The date is not a valid' 
         } 
         } 
        }, 
       date_to: { 
         validators: { 
          notEmpty: { 
          message: 'The date is required' 
         }, 
         date: { 
          format: 'MM/DD/YYYY', 
          message: 'The date is not a valid' 
         } 
         } 
        } 
      } 
     }); 
    }); 
    </script> 

    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker.min.css" /> 
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker3.min.css" /> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.4.5/css/bootstrapValidator.min.css" charset="UTF-8"> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.4.5/js/bootstrapValidator.min.js"></script> 
    <script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.min.js"></script> 
</html>

Когда я не выбрать любую дату из Datepicker и я представить форму, то он выдает сообщение об ошибке «дата требуется», так что опять я выбрать дату из Datepicker затем он показывает то же самое сообщение об ошибке. он не может повторить проверку. Как я могу решить эту проблему?Почему Bootstrap Datepicker не перепроверить

источник

2015-06-19 PHPdeveloper

Привет, добавьте bootstrapvalidator js и css-файл, чтобы я мог его проверить. –

привет, @MansukhKhandhar я добавил bootstrapvalidator js и css-файл в вышеуказанную форму. Обязательно проверьте его – PHPdeveloper

sumthing worn in above script. i мой локальный сервер приходит js error TypeError: $ (...). formValidation не является функцией $ ('# eventForm'). formValidation ('revalidateField', 'date_from'); –

Привет, пожалуйста, попробуйте этот скрипт, возможно, поможет.

$(document).ready(function() { 
 
     $('#datePicker') 
 
      .datepicker({ 
 
       format: 'mm/dd/yyyy' 
 
      }) 
 
      .on('changeDate', function(e) { 
 
       // Revalidate the date field 
 
       $('#eventForm').formValidation('revalidateField', 'date_from'); 
 
     }); 
 
     $('#datePicker2') 
 
      .datepicker({ 
 
       format: 'mm/dd/yyyy' 
 
      }) 
 
      .on('changeDate', function(e) { \t \t \t \t 
 
\t \t \t \t if(new Date($('#date1').val()) >= new Date($('#date2').val())) 
 
\t \t \t \t { 
 
\t \t \t \t \t alert('Set date proper !'); 
 
\t \t \t \t \t jQuery('#date2').val(''); 
 
\t \t \t \t } 
 
\t \t \t \t 
 
       // Revalidate the date field 
 
       //$('#eventForm').formValidation('revalidateField', 'date_to'); 
 
     }); 
 
\t \t 
 
\t \t (function($){ 
 
\t \t $.fn.formValidation = function(t1,t2) { 
 
\t \t  // alert(t2); 
 
\t  return this; 
 
\t \t }; 
 
\t \t })(jQuery); 
 

 

 
     $('#eventForm').bootstrapValidator({ 
 
      feedbackIcons: { 
 
       valid: 'glyphicon glyphicon-ok', 
 
       invalid: 'glyphicon glyphicon-remove', 
 
       validating: 'glyphicon glyphicon-refresh' 
 
      }, 
 
      fields: { 
 
       date1: { 
 
         validators: { 
 
          notEmpty: { 
 
          message: 'The date is required' 
 
         }, 
 
         date: { 
 
          format: 'MM/DD/YYYY', 
 
          message: 'The date is not a valid' 
 
         } 
 
         } 
 
        }, 
 
       date12: { 
 
         validators: { 
 
          notEmpty: { 
 
          message: 'The date is required' 
 
         }, 
 
         date: { 
 
          format: 'MM/DD/YYYY', 
 
          message: 'The date is not a valid' 
 
         } 
 
         } 
 
        } 
 
      } 
 
     }); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/css/datepicker3.min.css" rel="stylesheet"/> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.4.5/css/bootstrapValidator.min.css" rel="stylesheet"/> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.4.5/js/bootstrapValidator.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.min.js"></script> 
 

 
    <form role="form" class="margin_top" method="post" id="eventForm"> 
 

 
      <div class="form-group"> 
 
        <div class="input-group date form_date col-sm-12" data-date="" data-date-format="dd MM yyyy" data-link-field="dtp_input2" data-link-format="yyyy-mm-dd" id="datePicker"> 
 
         <input class="form-control" size="16" type="text" value="" name="date_from" id="date1" placeholder="Date of Arrival" readonly> 
 
         <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span> 
 
        </div> 
 
       </div> 
 
      <div class="form-group"> 
 
        <div class="input-group date form_date col-sm-12" data-date="" data-date-format="dd MM yyyy" data-link-field="dtp_input2" data-link-format="yyyy-mm-dd" id="datePicker2"> 
 
         <input class="form-control" size="16" type="text" value="" name="date_to" placeholder="Date of Departure" id="date2" readonly> 
 

 
         <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span> 
 
        </div> 
 
        <input type="hidden" id="dtp_input2" value="" /> 
 
       </div> 
 
     <button type="submit" name="send_request" class="btn btn-info bnt-md" value="send">Send Request</button> 
 
    </form>

Если какая-либо информация проблема меня. потому что я не уверен, что вам нужно.

источник

2015-06-22 10:34:39

Добавленный скрипт проверяет только поле 2-й даты, которое выбирает меньше или равно выбранному полю 1-й даты. Но оно не проверяется. означает, что оно показывает одно и то же сообщение об ошибке, то есть «дата требуется» .. ее не работает – PHPdeveloper

в приведенной выше демонстрации не может отобразить ошибку «Дата необходима». в какой-то проблеме в вашем дополнительном скрипте. Если добавить дополнительный скрипт, удалите временное и проверьте его –

Почему Bootstrap Datepicker не перепроверить

ответ

Смежные вопросы