JQuery Min and Max Date On Two Datepickers


Ketika kita menemui kasus misalnya ada dua buat tanggal dalam satu form, dimana keduanya menggunakan datepicker, kemudian kita ingin memvalidasi yaitu tanggal/bulan/tahun mulai tidak boleh lebih besar dari pada tanggal/bulan/tahun akhir dan begitupun sebaliknya tanggal/bulan/tahun akhir tidak boleh lebih kecil dari tanggal/bulan/tahun awal.
Dengan menggunkan fitur jQuery datepicker kita sebenarnya bisa men-disable tanggal yang seharusnya user tidak pilih, sehingga inputan user valid,
Berikut script jQuernya bisa rekan-rekan lihat di bawah ini, semoga bermanfaat
 : 



$(document).ready(function() {

    $('input[name=assign_period_start]').change(function(){
        var assign_period_start = $('[name^=assign_period_start]').datepicker('getDate');
        $('input[name=assign_period_end]').datepicker('option', 'minDate', assign_period_start);
    });

    $('input[name=assign_period_end]').change(function(){
        var assign_period_end = $('[name^=assign_period_end]').datepicker('getDate');
        $('input[name=assign_period_start]').datepicker('option', 'maxDate', assign_period_end);
    }); 

});



Berikut tampilan hasil validasinya :

JQuery Min and Max Date On Two Datepickers 

Post a Comment

0 Comments