2017-05-23 25 views
0

2つの入力ボックスがあり、1つは日付を選択し、もう1つは時間を選択するためのものです。これらの2つのボックスを条件に基づいて検証しようとしています。時間が選択されるべきではなく、私はeonasdan datetimepickerを使用しているはずです。希望の出力を得ていますが、タイムピッカーのシングルクリックではありません。ありがとうございます。ありがとうございましたdatepickerでワンクリックで時間が選択されない

これは何ですか?はるか:

function starttime(){ 
 
      $('#starttime').datetimepicker({ 
 
        format: 'HH:mm', 
 
        minDate: new Date() 
 
       }); 
 
      } 
 
      
 
      $('.start_time_addon').on('click keyup',function(){ 
 
      var x = $('#start').val(); 
 
      if (x == '') { 
 

 
      alert('please select startdate first'); 
 
      return false; 
 
      
 
      } 
 
      else{ 
 

 
      starttime(); 
 
      
 
      } 
 
      
 
     }); 
 
     
 
     var datePickerSix= $('.datetimepicker6'); 
 
      $(datePickerSix).datetimepicker({ 
 
      format: 'DD/MM/YYYY', 
 
      
 
minDate: new Date() 
 
     });
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker-standalone.min.css" rel="stylesheet"/> 
 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment-with-locales.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script> 
 

 

 
<div class="row"> 
 
     <div class="col-xs-6"> 
 
      <div class="form-group"> 
 
        <label>Start Date</label><br> 
 
      <div class='input-group date datetimepicker6'> 
 
            <input type='text' class="form-control" id="start" name="date_end" 
 
              placeholder="DD/MM/YYYY"/> 
 
            <span class="input-group-addon"> 
 
                   <span class="glyphicon glyphicon-calendar"></span> 
 
                  </span> 
 
           </div> 
 
     <div class="col-xs-6"> 
 
        <div class="form-group"> 
 
        <label for="start_time" class="col-form-label">Start Time</label> 
 
       <div class='input-group date start_time_addon' id='starttime'> 
 
        <input type='text' class="form-control" placeholder="HH : MM" id="Start_Time" required /> 
 
        <span class="input-group-addon"> 
 
         <span class="glyphicon glyphicon-time"></span> 
 
        </span> 
 
       </div> 
 
      </div> 
 
         </div> 
 
        </div> 
 
     
 
          </div> 
 
         </div>

答えて

0

$('.datetimepicker6').datetimepicker({ 
 
      format: 'DD/MM/YYYY', 
 
      
 
minDate: new Date() 
 

 
     }); 
 
     $('.datetimepicker6').on("dp.change", function(e) { 
 
      $('#starttime').datetimepicker({ 
 
      
 
        format: 'HH:mm', 
 
        minDate: new Date() 
 
       }); 
 

 
});
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker-standalone.min.css" rel="stylesheet"/> 
 

 
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment-with-locales.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script> 
 

 

 
<div class="row"> 
 
     <div class="col-xs-6"> 
 
      <div class="form-group"> 
 
        <label>Start Date</label><br> 
 
      <div class='input-group date datetimepicker6'> 
 
            <input type='text' class="form-control input_date" id="start" name="date_end" 
 
              placeholder="DD/MM/YYYY"/> 
 
            <span class="input-group-addon"> 
 
                   <span class="glyphicon glyphicon-calendar"></span> 
 
                  </span> 
 
           </div> 
 
     <div class="col-xs-6"> 
 
        <div class="form-group"> 
 
        <label for="start_time" class="col-form-label">Start Time</label> 
 
       <div class='input-group date start_time_addon' id='starttime'> 
 
        <input type='text' class="form-control" placeholder="HH : MM" id="Start_Time" required /> 
 
        <span class="input-group-addon"> 
 
         <span class="glyphicon glyphicon-time"></span> 
 
        </span> 
 
       </div> 
 
      </div> 
 
         </div> 
 
        </div> 
 
     
 
          </div> 
 
         </div>

+0

@Adrian Ghiuta、編集のためのおかげで、これは正常に動作しているが、我々は、入力フィールドに手動で入力しようとしている時はいつでも、それは値を受け入れている、むしろそれは、と入力フィールドを更新する必要があります現在の日付と時刻、これで私を助けてくれますか?前もって感謝します – parshu123

関連する問題