CODEWITHSUNDEEP
javascriptjquerydate
sathish kumar
sathish kumar

Reputation: 936

End date as selected startdate in foundation datetimepicker

Defaultly, startDate and endDate as showing the current date. I want t make the end date as selected start date not the current date.

Please look at this fiddle,

Fiddle

Here, defaultly it has showing current date in both startdate and enddate filed. For example, If I select startDate as "12-12-2017", I want end date as start with "12-12-2017" only not today's date. How can I do this. 

var nowTemp = new Date();
      var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);
      var checkin = jQuery('#startDate').fdatepicker({
          format: "dd.mm.yyyy",
          onRender: function (date) {
              return date.valueOf() < now.valueOf() ? 'disabled' : '';
          }
      }).on('changeDate', function (ev) {
              if (ev.date.valueOf() > checkout.date.valueOf()) {
                  var newDate = new Date(ev.date)
                  newDate.setDate(newDate.getDate() + 1);
                  checkout.setValue(newDate);
              }
              checkin.hide();
              jQuery('#endDate')[0];
          }).data('datepicker');
      var checkout = jQuery('#endDate').fdatepicker({
          format: "dd.mm.yyyy",
          onRender: function (date) {
              return date.valueOf() <= checkin.date.valueOf() ? 'disabled' : '';
          }
      }).on('changeDate', function (ev) {
              checkout.hide();
          }).data('datepicker');

          jQuery("#startDate,#endDate").fdatepicker({
              autoclose: true,
              format: "dd.mm.yyyy",
              language: 'de',
              todayHighlight: false
          });
<input type="text" id="startDate" name="start_datum" class="input_text date"   value="" >
    
<input type="text" id="endDate" name="end_datum" class="input_text" value="">

Upvotes: 0

Views: 287

Answers (1)

ViKu
ViKu

Reputation: 235

Check out this, I hope this solves your problem - Fiddle

var nowTemp = new Date();
      var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);
      var checkin = jQuery('#startDate').fdatepicker({
          format: "dd.mm.yyyy",
          onRender: function (date) {
              return date.valueOf() < now.valueOf() ? 'disabled' : '';
          }
      }).data('datepicker');
      var checkout = jQuery('#endDate').fdatepicker({
          format: "dd.mm.yyyy",
          onRender: function (date) {
              return date.valueOf() < checkin.date.valueOf() ? 'disabled' : '';
          }
      }).on('changeDate', function (ev) {
              checkout.hide();
          }).data('datepicker');

          jQuery("#startDate,#endDate").fdatepicker({
              autoclose: true,
              format: "dd.mm.yyyy",
              language: 'de',
              todayHighlight: false
          });

Upvotes: 0

Related Questions