jQuery UI Datepicker için Gün Filtresi

Geçenlerde sevgili Mert abim, bu konu hakkında benden ufak bir ricada bulundu. Biraz araştırdıktan sonra mantığı kavradım ve kullanmak için basit bir fonksiyon hazırladım. Bu fonksiyon ile datepicker için gün filtresi yapabiliyorusunuz..

Bize lazım olan sadece mevcut zamandan şu kadar gün sonrasını seçememe gibi bir olaydı.. Bende ona göre bir fonksiyon yazdım, ancak fonksiyonu biraz incelerseniz istediğiniz kısımları kendinizde devam ettirebilirsiniz diye düşünüyorum..

Öncelikle fonksiyon kodlarını vereyim;

function gunFiltre(date, dlimit, goncesi, pgun, agun) {
	
	/**
	 * Mevcut günden sonra kaç gün daha gözükebilsin?
	 */
	var gunLimit = dlimit ? dlimit : 0;
	
	/**
	 * Mevcut günden önceki diğer günlerin hepsi gözüksün
	 */
	var gunOncesi = goncesi;
	
	/**
	 * Günleri belirleyip işlem yaptırmak isterseniz bu diziye pasif olmasını istediğiniz günleri yazın
	 */
	var pasifGun = pgun ? pgun : [];
	
	/**
	 * Günleri belirleyip işlem yaptırmak isterseniz bu diziye aktif olmasını istediğiniz günleri yazın
	 */
	var aktifGun = agun ? agun : [];
	
	var bugunTarih = String(new Date()).split(' ');
	var mevcutTarih = String(date).split(' ');
	var ayDogrumu = bugunTarih[1] == mevcutTarih[1];
	
	/** 
	 * belirli günleri pasif eder
	 */
	if ( pasifGun.length > 0 ){
		if ( ayDogrumu && pasifGun.indexOf(parseInt(mevcutTarih[2])) != -1) {
			return [false];
		} else {
			return [true];
		}
	}
	
	/** 
	 * belirli günleri aktif eder
	 */
	if ( aktifGun.length > 0 ){
		if ( ayDogrumu && aktifGun.indexOf(parseInt(mevcutTarih[2])) != -1) {
			return [true];
		} else {
			return [false];
		}
	}
	
	/**
	 * gün limiti belirlenmişse mevcut zamandan o gün limiti kadarından sonrasını pasif yapar
	 */
	if ( gunLimit !== 0 && ayDogrumu ){
		for ( i = 0; i <= gunLimit; i++ ){
			if ( (parseFloat(bugunTarih[2]) + i) == mevcutTarih[2] ){
				return [true];
			}
		}
	}
	
	/**
	 * mevcut zamandan önceki günleri eğer belirlenmiş ise pasif yapar
	 */
	if ( gunOncesi === true && ayDogrumu ){
		if ( mevcutTarih[2] < parseFloat(bugunTarih[2]) ) {
			return [true];
		}
	}
	
	if ( ayDogrumu && gunLimit !== 0 ){
		return [false];
	} else {
		return [true];
	}
	
}

Nasıl kullanacağız?

Örnek kullanımları şöyle;

Sadece bugün ve 3 gün sonrası aktif olsun, diğer günler pasif olsun.

$('#datepicker').datepicker({
	beforeShowDay: function(tarih){
		return gunFiltre(tarih, 3);
	}
});

Bugünden önceki günler ve bugünden sonraki 3 gün hariç diğer günler pasif olsun.

$('#datepicker').datepicker({
	beforeShowDay: function(tarih){
		return gunFiltre(tarih, 3, true);
	}
});

Ayın sadece 1,7 ve 8. günleri pasif olsun;

$('#datepicker').datepicker({
	beforeShowDay: function(tarih){
		return gunFiltre(tarih, 0, true, [1, 7, 8]);
	}
});

Ayın sadece 1,5 ve 12. günleri aktif olsun;

$('#datepicker').datepicker({
	beforeShowDay: function(tarih){
		return gunFiltre(tarih, 0, true, [], [1,5,12]);
	}
});

Bir Cevap Yazın