JavaScriptTutorial

Hitung Selisih Hari Tanpa Sabtu Minggu dengan JavaScript

Hitung Selisih Hari Tanpa Sabtu Minggu dengan JavaScript
Hitung Selisih Hari Tanpa Sabtu Minggu dengan JavaScript

Afid Arifin – Halo teman-teman semua balik lagi bersama saya yang pada kesempatan kali ini saya akan  berbagi tutorial bagaimana cara hitung selisih hari tanpa sabtu dan minggu dengan javascript.

Nama lain dari perhitungan ini adalah hari business day yang mana kita akan mencoba mengambil selisih hari tanpa sabtu dan minggu.

Itu artinya maka kita hanya akan mengambil hari mulai dari hari senin sampai jum’at sesuai dengan business day pada umumnya.

Hitung Selisih Hari Tanpa Sabtu Minggu dengan JavaScript

Baiklah, langsung saja kita buat perhitungan selisih harinya dengan hanya dua langkah sederhana berikut ini.

Langkah Pertama Membuat Selisih Hari

Silahkan teman-teman buat file html baru lalu copy pastekan kode html berikut ke dalam file html yang telah kalian buat.

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Selisih Dua Tanggal Tanpa Hari Sabtu dan Minggu</title>
    <style>
      html, body {
        background-color: snow;
        font-family: Georgia;
      }
      #content {
        margin-top: 10px;
      }
    </style>
  </head>
  <body>
    <div id="content">
      <table>
        <tr>
          <td colspan="3"><h3>Hitung Selisih Hari Tanpa Sabtu dan Minggu</h3></td>
        </tr>
        <tr>
          <td><b>Tanggal Awal</b></td>
          <td>:</td>
          <td><input type="date" id="startdate" value="2020-07-01"></td>
        </tr>
        <tr>
          <td><b>Tanggal Akhir</b></td>
          <td>:</td>
          <td><input type="date" id="enddate" value="2020-07-31"></td>
        </tr>
        <tr>
          <td><b>Selisih Hari</b></td>
          <td>:</td>
          <td><output id="result">0 hari.</output></td>
        </tr>
      </table>
    </div>
  </body>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="script.js"></script>
</html>

Untuk menangani javascriptnya, di sini sudah saya tambahkan jQuery sebagai penangan action yang terjadi pada file html di atas.

Langkah Kedua Membuat Selisih Hari

Kemudian pada langkah kedua ini, silahkan teman-teman membuat file javascript baru lalu copy pastekan kode javascript berikut ini ke dalam file javascript yang telah kalian buat.

(function() {
  'use strict';
  function subsdays(begin, end) {
    let Weeks, DateDiff, Adjust = 0;

    if(end < begin) return 0; let WeekDay1 = begin.getDay(); let WeekDay2 = end.getDay(); WeekDay1 = (WeekDay1 == 0) ? 7 : WeekDay1; WeekDay2 = (WeekDay2 == 0) ? 7 : WeekDay2; if((WeekDay1 > 5) && (WeekDay2 > 5)) Adjust = 1;

    WeekDay1 = (WeekDay1 > 5) ? 5 : WeekDay1;
    WeekDay2 = (WeekDay2 > 5) ? 5 : WeekDay2;

    if(isNaN(WeekDay2 - WeekDay1)) return 0;

    Weeks = Math.floor((end.getTime() - begin.getTime()) / (60 * 60 * 24 * 7 * 1000));

    if(WeekDay1 < WeekDay2 || (WeekDay1 - WeekDay2) < 1) {
      DateDiff = (Weeks * 5) + (WeekDay2 - WeekDay1);
    } else {
      DateDiff = ((Weeks + 1) * 5) - (WeekDay1 - WeekDay2);
    }

    DateDiff -= Adjust;
    return (DateDiff + 1);
  }

  $('#startdate, #enddate').change(function() {
    let date1 = new Date($('#startdate').val());
    let date2 = new Date($('#enddate').val());
    $('#result').html('' + subsdays(date1, date2) + ' hari.');
    // document.getElementById('result').innerHTML = subsdays(date1, date2) + ' hari.';
    // window.location = 'update.php?begin=' + $('#startdate').val() + '&end=' + $('#enddate').val() + '';
  });
} ());

Jangan lupa save kedua file tersebut lalu jalankan file html yang telah kalian buat sebelumnya. Jika kalian membuat file htmlnya dengan nama index.html maka panggil lah file tersebut.

Demo dari tutorial kali ini dapat kalian lihat pada gambar berikut atau dapat kalian lihat di sini.

Hitung Selisih Hari Tanpa Sabtu Minggu dengan JavaScript

Hitung Selisih Hari Tanpa Sabtu Minggu dengan JavaScript

Apabila terdapat masalah saat kalian mencoba program di atas maka silahkan kalian tanyakan di kolom komentar yang tersedia di bawah

Sekian dari saya dan kurang lebihnya semoga bermanfaat buat kalian semua.

You may also like

Leave a reply

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *