CODEWITHSUNDEEP
jqueryjquery-uidatepicker
user727198
user727198

Reputation: 89

JQuery DateTimePicker add hours

I am using the following code, datepicker from jquery, to pick up a date from a calendar. When I select a date for the first field then this date and time will be entered in the second field too.

What I need is but to enter the date and time in the second field with addition of 10 hours (addHours(10)). I tried some options but did not succeed. Could you please advice where to put the code, .addHours(10), to get result in the second field?

var startDateTextBox = $('#rest_example_4_start');
var endDateTextBox = $('#rest_example_4_end');

startDateTextBox.datetimepicker({ 
    onClose: function(dateText, inst) {
        if (endDateTextBox.val() != '') {
            var testStartDate = startDateTextBox.datetimepicker('getDate');
            var testEndDate = endDateTextBox.datetimepicker('getDate');

            if (testStartDate > testEndDate)
                endDateTextBox.datetimepicker('setDate', testStartDate);
        } else {
            endDateTextBox.val(dateText);
        }
    },
    onSelect: function (selectedDateTime) {
        endDateTextBox.datetimepicker('option', 'minDate',  startDateTextBox.datetimepicker('getDate'));        
    }
});

endDateTextBox.datetimepicker({ 
    onClose: function(dateText, inst) {
        if (startDateTextBox.val() != '') {
            var testStartDate = startDateTextBox.datetimepicker('getDate');
            var testEndDate = endDateTextBox.datetimepicker('getDate');

            if (testStartDate > testEndDate)
                startDateTextBox.datetimepicker('setDate', testEndDate);
        }
        else {
        startDateTextBox.val(dateText);
        }
    },
    onSelect: function (selectedDateTime){
        startDateTextBox.datetimepicker('option', 'maxDate', endDateTextBox.datetimepicker('getDate')) 
        startDateTextBox.addHours(10);
    }
});

Upvotes: 1

Views: 11181

Answers (1)

Muhammad Hani
Muhammad Hani

Reputation: 8664

Im not sure but based on your inputs I think the below script will solve your issue, please provide a jsFiddle to trace it better.

$('#txtName').change(function() {
  var date2 = $('#txtName').datepicker('getDate'); 
  date2.setHours(date2.getHours()+10); 
    //alert(date2);
  $('#txtRes').val(date2);
});

JSFiddle Demo

Update: Demo that is compatible with datetimepicker.

  var date2 = $('#rest_example_4_start').datetimepicker('getDate'); 
  date2.setHours(date2.getHours()+10); 
  $('#rest_example_4_end').datetimepicker('setDate', date2);
});

Upvotes: 5

Related Questions