Wednesday, August 30, 2017

Bootstrap 3 datetimepicker - Setup Fromdate to ToDate - trigger Fromdate not gather than ToDate

 <div class="col-xs-12 col-md-12">  
      <div class="col-xs-12 col-md-6">  
           <div class="form-group form-group-sm">  
                <label class="col-xs-12 col-md-4 control-label">Ngày từ <span style="color: red">(*)</span></label>  
                <div class="col-xs-12 col-md-8">  
                     <div class="input-group input-group-sm input-datetime" id="divFDate">  
                          <input type="text" id="txtFDate" name="txtFDate"  
                                 class="form-control input-sm datetime-mask">  
                          <span class="input-group-addon">  
                               <span class="glyphicon glyphicon-calendar"></span>  
                          </span>  
                     </div>  
                </div>  
           </div>  
      </div>  
      <div class="col-xs-12 col-md-6">  
           <div class="form-group form-group-sm">  
                <label class="col-xs-12 col-md-4 control-label">Ngày đến<span style="color: red">(*)</span></label>  
                <div class="col-xs-12 col-md-8">  
                     <div class="input-group input-group-sm input-datetime" id="divTDate">  
                          <input type="text" id="txtTDate" name="txtTDate"  
                                 class="form-control input-sm datetime-mask">  
                          <span class="input-group-addon">  
                               <span class="glyphicon glyphicon-calendar"></span>  
                          </span>  
                     </div>  
                </div>  
           </div>  
      </div>  
 </div>  
Javascript
 this.SetupDate_Not_Time = function (input1, input2) {  
     input1.datetimepicker({  
       format: language.Date_Format,  
       showTodayButton: true,  
       defaultDate: base.DefaultDate().MomentFromDate,  
       showClose: true  
     });  
     input2.datetimepicker({  
       format: language.Date_Format,  
       showTodayButton: true,  
       defaultDate: base.DefaultDate().MomentToDate,  
       showClose: true  
     });  
     input1.on("dp.change", function (e) {  
       input2.data("DateTimePicker").minDate(e.date);  
     });  
     input2.on("dp.change", function (e) {  
       input1.data("DateTimePicker").maxDate(e.date);  
     });  
     input1.on("focusout", function (e) {  
       if (!moment($(e.target).val()).isValid()) {  
         try{  
           input1.data("DateTimePicker").defaultDate(base.DefaultDate().FormDate);  
         }  
         catch(e) {  
           input1.data("DateTimePicker").defaultDate(input2.data("DateTimePicker").date());  
         }  
       }  
     });  
     input2.on("focusout", function (e) {  
       if (!moment($(e.target).val()).isValid()) {  
         try {  
           input2.data("DateTimePicker").defaultDate(base.DefaultDate().ToDate);  
         }  
         catch (e) {  
           input2.data("DateTimePicker").defaultDate(input1.data("DateTimePicker").date());  
         }  
       }  
     });  
   }  
USE: this.SetupDate_Not_Time($("#divFDate"), $("#divTDate"));

No comments:
Write comments