2017-05-20 6 views
0

私は無効日間、このコードを使用し、月曜日のみを選択することができますが、今、私は今年のいくつかの特定の日を有効にする必要がありますいくつかの日を無効にした後で翌日を有効にする方法はありますか?

$(function(){ 

    $("#fecha").datepicker({ 
    minDate: 0, 
    maxDate: "+3M", 
    dateFormat: 'yy-mm-dd', 
    beforeShowDay: function (date) { 
     if (date.getDay() == 1) { 
     return [true, '']; 
     } else { 
     return [false, '']; 
     } 
    } 
    }); 

    $("#fecha2").datepicker({ 
    minDate: 0, 
    maxDate: "+3M", 
    dateFormat: 'yy-mm-dd', 
    beforeShowDay: function (date) { 
     if (date.getDay() == 1) { 
     return [true, '']; 
     } else { 
     return [false, '']; 
     } 
    } 
    }); 

}); 

私は2017年の7月20日(20のようないくつかの特定の日付を有効にする必要があります-Jul-2017)。

答えて

0

このようにしますか?これにより、アレイ内の特定の日付が有効になり、月曜日が有効になっていることが示されます。

var availableDates = ["9-5-2017","14-5-2017","15-5-2017"]; 
 

 
function available(date) { 
 
    dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear(); 
 
    if ($.inArray(dmy, availableDates) != -1) { 
 
    return [true, "","Available"]; 
 
    } else { 
 
    \t if (date.getDay() == 1) { 
 
     return [true, '']; 
 
    } else { 
 
     return [false,"","unAvailable"]; 
 
    } 
 
    } 
 
} 
 

 
$('#date').datepicker({ beforeShowDay: available });
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" rel="stylesheet"/> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
 
<input type="text" name="date" id="date" readonly="readonly" size="12" />

0

私は@gagansheraと同様の答えを持っています。

許可された日付配列との日付比較は異なりますが、結果は同じです。

はまたCodePen

$(function(){ 
 

 
    // Human readable date array 
 
    var allowedDays = ["2017-05-25", "2017-06-16", "2017-07-21"]; 
 
    
 
    // Same array as Date objects 
 
    var allowed = []; 
 
    $.each(allowedDays,function(i,val){ 
 
    allowed[i] = new Date(val+" 0:00"); 
 
    }); 
 
    
 
    // Define options 
 
    var dapickerOptions = { 
 
    minDate: 0, 
 
    maxDate: "+3M", 
 
    dateFormat: 'yy-mm-dd', 
 
    beforeShowDay: function (date) { 
 
     
 
     // If an allowed date 
 
     if(JSON.stringify(allowed).indexOf(date.toISOString())!=-1){ 
 
     return [true, 'orange']; 
 
     } 
 
     
 
     // If a monday 
 
     if (date.getDay() == 1) { 
 
     return [true, 'green']; 
 
     
 
     } else { 
 
     return [false, '']; 
 
     } 
 
    } 
 
    }; 
 
    
 
    // Initiate the datePickers 
 
    $("#fecha").datepicker(dapickerOptions); 
 
    $("#fecha2").datepicker(dapickerOptions); 
 

 
}); // ready
.green a{ 
 
    background-color:green !important; 
 
} 
 
.orange a{ 
 
    background-color:orange !important; 
 
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css" rel="stylesheet"/> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
 

 
<input id="fecha"><br> 
 
<br> 
 
<input id="fecha2"><br>

で見ます
関連する問題