Shiela
Shiela

Reputation: 669

Add days date picker JS

I have a problem with adding days to a date using a date-picker. I know this has been asked many times but we have different implementation of codes that's why I need help to whoever knows about this. When adding days, it must be that the Saturdays and Sundays are excluded. I have this code:

<script type="text/javascript">
        $(document).ready(function () {
            $("#dt1").datepicker({
                dateFormat: "dd-M-yy",
                minDate: 0,
                onSelect: function (date) {
                    var date2 = $('#dt1').datepicker('getDate');
                    date2.setDate(date2.getDate() + 2);
                    if (date2.getDay() != 0 && date2.getDay() != 6) // Skip weekends
                   { $('#dt2').datepicker('setDate', date2);
                    //sets minDate to dt1 date + 1
                    $('#dt2').datepicker('option', 'minDate', date2);
                }
                }
            });
            $('#dt2').datepicker({
                dateFormat: "dd-M-yy",
                onClose: function () {
                    var dt1 = $('#dt1').datepicker('getDate');
                    console.log(dt1);
                    var dt2 = $('#dt2').datepicker('getDate');
                    if (dt2 <= dt1) {
                        var minDate = $('#dt2').datepicker('option', 'minDate');
                        $('#dt2').datepicker('setDate', minDate);
                    }
                }
            });
        });
    </script>

Using <script src="../js/jquery-1.9.1.js"></script>

And here are my input fields:

<input type="text" id="dt1" name="date_borrow" pattern="alpha" required/>
<input type="text" id="dt2" name="date_will_return" pattern="alpha" required/>

So, when I click this or this, result must be this.

The adding of days I have tried above does not work. What did I miss from there?

Upvotes: 0

Views: 1372

Answers (2)

suomi-dev
suomi-dev

Reputation: 868

In case if any one wants to skip certain week days, I have written this code. May be this could be useful for anyone.

function AddDays(date, offset, skipSunday, skipMonday, skipTueday, skipWednesday, skipThursday, skipFriday, skipSaturday) {

// If user wants to skip all days then return the same date because this is not possible
if (skipSunday && skipMonday && skipTueday && skipWednesday && skipThursday && skipFriday && skipSaturday) {
    return date;
}

// Create array for all day numbers
var skipDays = [];
if (skipSunday) skipDays.push(0);
if (skipMonday) skipDays.push(1);
if (skipTueday) skipDays.push(2);
if (skipWednesday) skipDays.push(3);
if (skipThursday) skipDays.push(4);
if (skipFriday) skipDays.push(5);
if (skipSaturday) skipDays.push(6);

while (offset > 0) {
    date.setDate(date.getDate() + 1);
    if ($.inArray(date.getDay(), skipDays) <= -1) {
        offset--
    }
}
return date;

}

Upvotes: 0

Karthick Kumar
Karthick Kumar

Reputation: 2361

$(document).ready(function () {
    $("#dt1").datepicker({
        dateFormat: 'dd-M-yy',
        minDate: 0,
        beforeShowDay: function (date) {
            var day = date.getDay();
            return [(day != 0 && day != 6), '']
        },
        onSelect: function (date) {
            var date2 = $("#dt1").datepicker('getDate');
            if (date2.getDay() == 5) {
                date2.setDate(date2.getDate() + 3);
                $("#dt2").datepicker('setDate', date2);
            } else if (date2.getDay() == 3) {
                date2.setDate(date2.getDate() + 2);
                $("#dt2").datepicker('setDate', date2);
            } else if (date2.getDay() == 4) {
                date2.setDate(date2.getDate() + 4);
                $("#dt2").datepicker('setDate', date2);
            } else {
                date2.setDate(date2.getDate() + 2);
                $("#dt2").datepicker('setDate', date2);
            }

        }
    })
    $('#dt2').datepicker({
        dateFormat: 'dd-M-yy',
        minDate: 0,
        beforeShowDay: function (date) {
            var day = date.getDay();
            return [(day != 0 && day != 6), '']
        },
    });
});

Upvotes: 1

Related Questions