您好,登錄后才能下訂單哦!
Kendo UI Web包含數(shù)百個創(chuàng)建HTML5 web app的必備元素,包括UI組件、數(shù)據(jù)源、驗證、一個MVVM框架、主題、模板等。本文來看看如何配置Kendo UI Calendar。
1、創(chuàng)建新的操作方法來顯示視圖:
public ActionResult Index()
{
return View();
}
2、添加日歷
WebForms
<%: Html.Kendo().Calendar()
.Name("calendar") //The name of the calendar is mandatory. It specifies the "id" attribute of the widget.
.Min(new DateTime(2010, 1, 1, 10, 0, 0)) //Set min time of the calendar
.Max(new DateTime(2010, 1, 1, 20, 0, 0)) //Set min date of the calendar
.Value(DateTime.Now) //Set the value of the calendar
%>
Razor
@(Html.Kendo().Calendar()
.Name("calendar") //The name of the calendar is mandatory. It specifies the "id" attribute of the widget.
.Min(new DateTime(2010, 1, 1, 10, 0, 0)) //Set min time of the calendar
.Max(new DateTime(2010, 1, 1, 20, 0, 0)) //Set min date of the calendar
.Value(DateTime.Now) //Set the value of the calendar
)
訪問Existing Calendar
通過jQuery.data()引用一個現(xiàn)有日歷實例,一旦建議了引用,就可以使用API來控制它的行為。
訪問現(xiàn)有日歷實例
//Put this after your Kendo Calendar for ASP.NET MVC declaration
<script>
$(function() {
// Notice that the Name() of the calendar is used to get its client-side instance
var calendar = $("#calendar").data("kendoCalendar");
});
</script>
處理Kendo UI Calendar事件
通過Kendo UI Calendar可以訂閱所有的事件。
WebForms -由處理程序名稱訂閱
<%: Html.Kendo().Calendar()
.Name("calendar")
.Events(e => e
.Change("calendar_change")
.Navigate("calendar_navigate")
)
%>
<script>
function calendar_navigate() {
//Handle the navigate event
}
function calendar_change() {
//Handle the change event
}
</script>
Razor -由處理程序名稱訂閱
@(Html.Kendo().Calendar()
.Name("calendar")
.Events(e => e
.Change("calendar_change")
.Navigate("calendar_navigate")
)
)
<script>
function calendar_navigate() {
//Handle the navigate event
}
function calendar_change() {
//Handle the change event
}
</script>
Razor -通過模板委托訂閱
@(Html.Kendo().Calendar()
.Name("calendar")
.Events(e => e
.Change(@<text>
function() {
//Handle the change event inline
}
</text>)
.Navigate(@<text>
function() {
//Handle the navigate event inline
}
</text>)
)
點擊下載Kendo UI Web
免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。