2016-11-24 5 views
0

私はブートストラップの検証datetimepickerに問題がありました。 endDateはstartDateより小さく、メッセージを表示するか、endDate入力をstartDateよりも大きくする必要があります。datetimepicker startDateはendDateより大きくはない

私はこのようなDateTimePickerの形式があります。

$(document).ready(function() { 
$(".datetimepicker").datetimepicker({ 
    format: "YYYY-MM-DD", 
}); 

とここに私のフォームのコードがあります:

<div class="col-xs-4 col-sm-4 col-md-4"> 
    <div class="form-group"> 
     <label>Date In:</label> 
     {!! Form::text('date_in', null, array('id' => 'date_in', 'class' => 'form-control datetimepicker')) !!} 
    </div> 
</div> 

<div class="col-xs-4 col-sm-4 col-md-4"> 
    <div class="form-group"> 
     <label>Date Out:</label> 
     {!! Form::text('date_out', null, array('id' => 'date_out', 'class' => 'form-control datetimepicker')) !!} 
    </div> 
</div> 

はここに、これまでの私のjQueryの:

$.each(inputFormEle, function(index, value) { 
var getElByName = $(value).attr('name') 

switch(getElByName) { 
case 'date_in': 

    $('#accidentForm').bootstrapValidator('addField', getElByName, { 
     validators: { 
      date: { 
       format: 'YYYY-MM-DD' 
      }, 
      callback: { 
       callback: function(value, validator, $field) { 
        var dateIn = moment(value); 
        var dateOut = moment($('input[name="date_in"]').val()); 
        console.log(dateIn, dateOut); 
        if (dateIn.isBefore(dateOut)) { 
         return { 
          valid: true, 
         } 
        } 
        else { 
         return { 
          valid: false, 
          message: 'The Date in must be less than Date out' 
         } 
        } 
       } 
      } 
     }, 
    }); 

break; 

case 'date_out': 

    $('#accidentForm').bootstrapValidator('addField', getElByName, { 
     validators: { 
      date: { 
       format: 'YYYY-MM-DD' 
      }, 
      callback: { 
       callback: function(value, validator, $field) { 
        var dateOut = moment(value); 
        var dateIn = moment($('input[name="date_out"]').val()); 

        if (dateOut.isAfter(dateIn)) { 
         return { 
          valid: true, 
         } 
        } 
        else { 
         return { 
          valid: false, 
          message: 'The Date out must be greater than Date in' 
         } 
        } 
       } 
      } 
     } 
    }); 
break; 
    } 
}); 

それはで働いていませんすべて、どんなアイデアですか?ありがとう。

+0

[日時ピッカー検証開始日が動作していない終了日未満でなければなりません]の可能な重複(http://stackoverflow.com/questions/30589514/datetime-picker-validation-start-date-should-be -less-than-end-date-not-working) – Abhijeet

答えて

0
$("#endDate").change(function(){ 

    var startDate = new Date($("#startDate").val()); 

    var endtDate = new Date($("#endDate").val()); 

    if(startDate < endtDate){ 

     /* your validation and error message */ 

    }else{ 

     /* your piece of code*/ 

    } 
}); 


/* similarly you can write for start date also */ 
+0

スレッドをjqueryコードで更新しましたが、それでも動作しません。 –

関連する問題