How can I find number of days excluding saturdays and sundays using Datepicker?

Question

I found a code for finding days excluding weekends between two date without using datapicker but I need to show calendar(visually).I wrote code for showing calendar with datapicker but I could not be successful to update the code to write the code the way to cover the weekend.I need this calendar for an ASP.NET Core MVC project.

I will write both:

<script>
    $(function () {
        $("#date1").datepicker();
        var date1 = $("#date1")
    });
    $(function () {
        $("#date2").datepicker();
        var date2 = $("#date2")
    });
    count = 0;
    
    function Diffr() {
        date1 = new Date(date1.value);
        date2 = new Date(date2.value);
        if (date1 < date2)
        {
            var milli_seconds = date1.getTime() - date2.getTime();
        }
        else
            var milli_seconds = date2.getTime() - date1.getTime();
      
        var days = milli_seconds / (1000 * 3600 * 24);
        document.getElementById("idd").innerHTML = Math.round(Math.abs(days));
    }
</script>

<p>
    Date1 :
    <input type="text" id="date1">
</p>

<p>
    Date2 :
    <input type="text" id="date2">
</p>
<button id="sub" class="btn btn-success" onclick="Diffr()">Submit</button>
<h3 id="idd">Difference</h3>

The other one is:

<script>
    function CalculateDiffr() {
        var date = document.getElementById('txt_Start').value;
        var date1 = date.split('.')[1] + "/" + date.split('.')[0] + "/" + date.split('.')[2];

        date = document.getElementById('txt_Last').value;
        var date2 = date.split('.')[1] + "/" + date.split('.')[0] + "/" + date.split('.')[2];

        var days = ['N', 'Y', 'Y', 'Y', 'Y', 'Y', 'N'];

        var d1 = new Date(date1);
        var d2 = new Date(date2);

        var busssinessday= 0;

        while (true) {

            if (d1 > d2) {
                break;
            }

            var dayName = days[d1.getDay()];

            if (dayName != "N") {
                businessday++;
            }

            d1.setDate(d1.getDate() + 1);
        }

        document.getElementById('Days').value = businessday.toString();
    }
</script>

@Html.TextBox("txt_Start", "", new { @class = "form-control" })
@Html.TextBox("txt_Last", "", new { @class = "form-control" })
@Html.TextBox("Days", "", new { @class = "form-control" })

<button onclick="CalculateDiffr()">OK</button>

score 1 · Answer 1 · answered Mar 16 '23 at 07:01

How about using type="date" to show calendar(visually) ?

Try:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<label>
    Start Date
    <input type="date" id="startdate"  />
</label>

<label>
    End Date
    <input type="date" id="enddate" />
</label>

<label>
    N. of days
    <output id="noofdays" />
</label>

<script>
    function calcBusinessDays(dDate1, dDate2) { // input given as Date objects
        var iWeeks, iDateDiff, iAdjust = 0;
        if (dDate2 < dDate1) return -1; // error code if dates transposed
        var iWeekday1 = dDate1.getDay(); // day of week
        var iWeekday2 = dDate2.getDay();
        iWeekday1 = (iWeekday1 == 0) ? 7 : iWeekday1; // change Sunday from 0 to 7
        iWeekday2 = (iWeekday2 == 0) ? 7 : iWeekday2;
        if ((iWeekday1 > 5) && (iWeekday2 > 5)) iAdjust = 1; // adjustment if both days on weekend
        iWeekday1 = (iWeekday1 > 5) ? 5 : iWeekday1; // only count weekdays
        iWeekday2 = (iWeekday2 > 5) ? 5 : iWeekday2;

        // calculate differnece in weeks (1000mS * 60sec * 60min * 24hrs * 7 days = 604800000)
        iWeeks = Math.floor((dDate2.getTime() - dDate1.getTime()) / 604800000)

        if (iWeekday1 < iWeekday2) { //Equal to makes it reduce 5 days
            iDateDiff = (iWeeks * 5) + (iWeekday2 - iWeekday1)
        } else {
            iDateDiff = ((iWeeks + 1) * 5) - (iWeekday1 - iWeekday2)
        }

        iDateDiff -= iAdjust // take into account both days on weekend

        return (iDateDiff + 1); // add 1 because dates are inclusive
    }


    $("#startdate, #enddate").change(function () {

        var d1 = $("#startdate").val();
        var d2 = $("#enddate").val();

        var minutes = 1000 * 60;
        var hours = minutes * 60;
        var day = hours * 24;

        var startdate1 = new Date(d1);
        var enddate1 = new Date(d2);


        var newstartdate = new Date();
        newstartdate.setFullYear(startdate1.getYear(), startdate1.getMonth(), startdate1.getDay());
        var newenddate = new Date();
        newenddate.setFullYear(enddate1.getYear(), enddate1.getMonth(), enddate1.getDay());
        var days = calcBusinessDays(newstartdate, newenddate);
        if (days > 0) {
            $("#noofdays").val(days);
        } else {
            $("#noofdays").val(0);
        }
    });
</script>

result: refer this answer

Thank you for your answer but when I copy-paste your code without changing anything and try it not working for every value.Like when I write:02.03.2023 and 12.03.2023.The answer is getting 0 when I write this .What could be the reason for this?@Qing Guo — n_stckwf, Mar 16 '23 at 07:20
@n_stckwf Do you want this:https://i.stack.imgur.com/CsKk4.png ? You don't need to write 02.03.2023, try to click the calendar. — Qing Guo, Mar 16 '23 at 07:23
@n_stckwf You can use the full code to try. look: https://i.stack.imgur.com/UEiky.gif — Qing Guo, Mar 16 '23 at 07:30
No,it was just a sample to specify I guess the problem is when I write 02/03/2023 by using calendar the number three corresponds to the month of March. I will look at the problem again but thanks a lot for your answer.@Qing Guo — n_stckwf, Mar 16 '23 at 07:34

score 1 · Answer 2 · answered Mar 16 '23 at 07:25

According to this answer, you just create a function to get the count of the business days:

$(function () {
        $("#date1").datepicker();
        var date1 = $("#date1")
    });
$(function () {
    $("#date2").datepicker();
    var date2 = $("#date2")
});

function getBusinessDatesCount(startDate, endDate) {
    let count = 0;
    const curDate = new Date(startDate.getTime());
    while (curDate <= endDate) {
        const dayOfWeek = curDate.getDay();
        if(dayOfWeek !== 0 && dayOfWeek !== 6) count++;
        curDate.setDate(curDate.getDate() + 1);
    }
    return count;
}

function Diffr() {
    date1 = new Date(date1.value);
    date2 = new Date(date2.value);
    
    let days = getBusinessDatesCount(date1, date2);
    document.getElementById("idd").innerHTML = Math.round(Math.abs(days));
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/4.6.2/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/4.6.2/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js"></script>
<p>
    Date1 :
    <input type="text" id="date1">
</p>

<p>
    Date2 :
    <input type="text" id="date2">
</p>
<button id="sub" class="btn btn-success" onclick="Diffr()">Submit</button>
<h3 id="idd">Difference</h3>

How can I find number of days excluding saturdays and sundays using Datepicker?

2 Answers2