Postingan lainnya
Buku Ini Koding!
Baru!
Buku ini akan jadi teman perjalanan kamu belajar sampai dapat kerjaan di dunia programming!
Menghitung hari dengan datepicker
Gan bagaimana caranya menghitung hari antara dua tanggal menggunakan datepicker ?
6 Jawaban:
https://jsfiddle.net/372j1hsb/6/
Contoh Kodinganya, Saya Pakai Datepickernya Jquery UI :
<html>
<body>
<div>
<div id="first">
<span>Tanggal Awal : <span id="tgl_awal"></span></span>
</div>
<div id="second" style="margin-top: 10px;">
<span>Tanggal Akhir : <span id="tgl_akhir"></span></span>
</div>
<div id="diff" style="margin-top: 10px;">
Jangka Waktu : <span id="jw"></span>
</div>
</div>
<script>
var mD = {
first: '',
scnd: '',
init: function(){
this.setFirst();
this.setSecond();
},
setFirst: function(){
var _this = this;
$("#first").datepicker({
onSelect: function(){
_this.first = $(this).val();
$("#tgl_awal").html(_this.first)
_this.calcDiff();
}
});
},
setSecond: function(){
var _this = this;
$("#second").datepicker({
onSelect: function(){
_this.scnd = $(this).val();
$("#tgl_akhir").html(_this.scnd);
_this.calcDiff();
}
});
},
calcDiff: function(){
var date1 = new Date(this.first);
var date2 = new Date(this.scnd);
var timeDiff = Math.abs(date2.getTime() - date1.getTime());
var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
if(date1 > date2){
$("#jw").html("TANGGAL AWAL TIDAK BOLEH LEBIH BESAR DARI TANGGAL AKHIR");
} else {
$("#jw").html(diffDays);
}
}
}
mD.init();
</script>
</body>
</html>
ijin update kodenya gan @CodenameJR. saya update supaya kalo tanggal awal lebih besar dari tgl akhir yg keluar bukan pesan error tapi datepickernya otomatis menyesuaikan. sekedar sharing untuk alternatif solusi. https://jsfiddle.net/372j1hsb/7/
gan semisal code ane gini
kode view
<label>Tanggal Mulai</label>
<input type="text" name="tgl_mulai" class="form-control pull-right" id="datepicker">
<label>Tanggal Akhir</label>
<input type="text" name="tgl_akhir" class="form-control pull-right" id="datepicker2">
<label>Lama</label>
<input type="text" name="lama" class="form-control pull-right" id="selisih">
code js bagaimana ?
Kenapa input typenya harus text? kan tanggal yang diinput.