jQuery Datepicker adding days

Question

Edit: working fiddle: http://jsfiddle.net/yao6dgex/

Edit 2: I think I know what's going on, but no reason why, it' getting the actual day and adding the days, instead of adding days from the selected date.

I have found this answer to my question, but it's not solving anything at all.

The problem is, that when I add X days, in the same calendar or another one, it's going to the next month in the X day.

My code looks like:

$(document).ready(function() {
    $("#cal3").datepicker({
        showOtherMonths: true,
        selectOtherMonths: true,
        dateFormat: "dd/mm/y",
        onSelect: function(selectedDate) {
            $("#cal4").datepicker("setDate", selectedDate);
            $("#cal4").datepicker("setDate", "+3d");
            $("#cal4").datepicker( "option", "minDate", selectedDate );
        }
    });
    $("#cal4").datepicker({
        showOtherMonths: true,
        selectOtherMonths: true,
        dateFormat: "dd/mm/y",
        onSelect: function(selectedDate) {
            $("#cal3").datepicker( "option", "maxDate", selectedDate );
        }
    });
});

In this example, I added the selected date to cal4 and then add 3 days from it.

Datepicker setDate API says:

Sets the date for the datepicker. The new date may be a Date object or a string in the current date format (e.g., "01/26/2009"), a number of days from today (e.g., +7) or a string of values and periods ("y" for years, "m" for months, "w" for weeks, "d" for days, e.g., "+1m +7d"), or null to clear the selected date.

I'm trying to add X days with "+Xd", so, why it is not working?

can its possible for you to create a working fiddle for this? — vijayP
– vijayP, Commented Nov 30, 2015 at 9:52
I think I know what's going on, but no reason why, it' getting the actual day and adding the days, instead of adding days in the selected date — Zander
– Zander, Commented Nov 30, 2015 at 10:04

frikinside · Accepted Answer · 2015-11-30 11:22:14Z

2

I would suggest a simple workaround. Instead of letting datepicker to manage the add days operation, we can do it with a Date() javascript object.

Something like this:

$(document).ready(function() {
    $("#cal3").datepicker({
        showOtherMonths: true,
        selectOtherMonths: true,
        dateFormat: "dd/mm/y",
        onSelect: function(selectedDate) {
            //$("#cal4").datepicker("setDate", selectedDate);
            var date = $(this).datepicker("getDate"); //Get the Date object with actual date
            date.setDate(date.getDate() + 3); //Set date object adding 3 days.
            $("#cal4").datepicker("setDate", date); //Set the date of the datepicker with our date object
            $("#cal4").datepicker( "option", "minDate", selectedDate );
        }
    });
    $("#cal4").datepicker({
        showOtherMonths: true,
        selectOtherMonths: true,
        dateFormat: "dd/mm/y",
        onSelect: function(selectedDate) {
            $("#cal3").datepicker( "option", "maxDate", selectedDate );
        }
    });
});

I fork the jsFiddle with the answer code.

answered Nov 30, 2015 at 11:22

frikinside

1,2441 gold badge9 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Zander Over a year ago

Thanks. I had to do a workaround as yours to get what I needed. At first I thought that the plugin would do the work with a selected date, but it seems it does not. Thanks for your time!

frikinside Over a year ago

You're welcome! Glad to be helpful. Looks reasonable that datepicker provide the desired functionality but it doesn't. If you need to this very often maybe you could try to add a new method on the plugin to do the desired operation.

Collectives™ on Stack Overflow

jQuery Datepicker adding days

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related