0

Calendar is displaying but I have to change date on next and previous button click and it is not working.

I am using Bootstrap V3 and datetimepicker version 4.15.35 https://github.com/Eonasdan/bootstrap-datetimepicker

Here is code :

//To display Calendar
$(document).ready(function() {
    $('#datetimepicker1').datetimepicker({
        format: "MM/DD/YYYY",
        defaultDate: new Date()
    });
});

//Next button added to Change date on next button click
$(function() {
    $('#next').click(function() {
        var date = $('#datetimepicker1').data("DateTimePicker").getDate(); // giving error
        date.setTime(date.getTime() + (1000 * 60 * 60 * 24))
        $('#datetimepicker1').datepicker("setDate", date);
    });
});

//Previous button added to Change date on prev button click
$(function() {
    $('#previous').click(function() {
        var date = $('#datetimepicker1').datetimepicker('getDate');
        date.setTime(date.getTime() - (1000 * 60 * 60 * 24))
        $('#datetimepicker1').datetimepicker("setDate", date);
    });
});
freedomn-m
  • 27,664
  • 8
  • 35
  • 57
Shital Umare
  • 3
  • 3

1 Answers1

0

I would recommend that you manipulate the date(s) using moment

see working sample on JSFiddle

$('#datetimepicker1').datetimepicker({
    format: "MM/DD/YYYY",
    defaultDate: new Date()
});

//Next button added to Change date on next button click
$(function() {
    $('#next').click(function(event) {
        event.preventDefault();
        var date = $('#datetimepicker1').data("DateTimePicker").date();
        nextdate = moment(date).add(1, 'days');
        $('#datetimepicker1').data("DateTimePicker").date(nextdate);
    });
});

//Previous button added to Change date on prev button click
$(function() {
    $('#previous').click(function(event) {
        event.preventDefault();
        var date = $('#datetimepicker1').data("DateTimePicker").date();
        predate = moment(date).subtract(1, 'days');
        $('#datetimepicker1').data("DateTimePicker").date(predate);
    });
});
Jason Tate
  • 606
  • 1
  • 7
  • 10
  • Thank you Jason. Date are changing on Next and previous button click :) .One more issue I am facing ,when I am trying to pass selected date to model it is not fetching date, giving me error. Also I want to pass date in format "YYYYMMDD". Thanks for your help. – Shital Umare Feb 17 '16 at 22:50
  • @Shital Glad you made some progress, if your original question has been solved can you mark this answer as accepted? If you have additional issues it's best to ask a new question with more details, scripts in use, what you have tried, and so forth.. At this point it's not clear which model you are using, but that does not seem relevant to the original question. I'll keep an eye out for additional questions and help if I'm able – Jason Tate Feb 18 '16 at 02:34