2015-01-21 55 views
0

有誰知道是否有可能通過天數來限制在日期選擇的日子在Kendo UI日期選擇器?是否可以過濾Kendo UI日期選擇器中的可選天數?

EG - 使僅週一至週五可選..

<input kendo-date-picker=""  
     ng-model="dateString" 
     days="[0,1,2,3,4]"/> 
+0

我不認爲datepicker有這樣的功能。也許將一個JS函數綁定到datepicker的'Change'事件,並檢查它是否是一週或週末。如果是週末的話,'e.preventDefault();'應該避免選擇 – chiapa 2015-01-21 09:49:39

+0

@chiapa謝謝,但我希望能有一天變成灰色和只讀。 – Grant 2015-01-22 00:34:25

回答

0

有對劍道的DatePicker沒有這樣的功能:它has been asked in the Telerik forum前,從他們的回答是「的行爲目前不支持」。

有一個UserVoice項目正在請求創建它。

這裏有一個自定義的解決方法,模擬你想要什麼:

$(document).ready(function() { 
 

 
    var p = $("#datepicker").kendoDatePicker({ 
 
    value: new Date(), //setting the value to "today" 
 
    open: function(e) { 
 
     $(".disabledDay").parent().removeClass("k-link"); 
 
     $(".disabledDay").parent().removeAttr("href"); 
 
     $('.k-weekend a').bind('click', function() { 
 
     return false; 
 
     }); 
 
    } 
 
    }).data("kendoDatePicker"); 
 
});
.k-weekend { 
 
    background-color: silver; 
 
} 
 
.k-weekend:hover { 
 
    background-color: silver !important; 
 
} 
 
.k-weekend a:hover { 
 
    background-color: silver !important; 
 
} 
 
.k-calendar a:hover { 
 
    background-color: red; 
 
}
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <link href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css" rel="stylesheet" type="text/css" /> 
 
    <link href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.default.min.css" rel="stylesheet" type="text/css" /> 
 
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
 
    <script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script> 
 
    <meta charset=utf-8 /> 
 
    <title>KendoUI Example</title> 
 
</head> 
 

 
<body> 
 
    <input id="datepicker" style="width:150px;" /> 
 

 
</body> 
 

 
</html>

這不是理想的,我知道,但因爲功能不小部件本身的存在,只能通過變通方法我們可以獲得這樣的行爲。有了這個,你不能選擇週末的日子,並且在CSS上稍微花點時間就可以實現你想要的。

+0

感謝您的示例。同意它不理想,但它比沒有好。會接受你的答案。 – Grant 2015-01-22 22:48:22

相關問題