wijmo for java_[Java教程]Wijmo 更优美的jQuery UI部件集：活动日历控件(Event Calendar)

墨蓝 2022-11-05 03:29 39阅读 0赞

\[Java教程\]Wijmo 更优美的jQuery UI部件集：活动日历控件(Event Calendar)

0 2012-05-10 16:00:51

Wijmo Event Calendar活动日历控件，是一个功能齐全的活动日历控件，允许用户添加，编辑和管理他们的日程。默认情况下，控件将使用Html5的Local Storage特性，进行离线数据存储，用户可以在不连接网路的情况下，使用网页来管理自己的日程，无需额外的配置。

Wijmo Event Calendar支持用户自定义数据存储方式。Wijmo Event Calendar 控件在设计之初就将数据展现和数据存储进行分离，您可以使用amplify.store库，实现本地数据存储。然后设置：dataStorage，指定自定义的数据存储层，设置visibleCalendars决定那些日历需要显示。

Wijmo Event Calendar 支持灵活的UI定制，自带的Theme就很像 apple 的Calendar， 您可以显示/隐藏标题栏，导航栏，状态栏，右边的窗口。

下面是默认UI：

Day View

![bc91bb04e6e9c61e24c974e4440db8f2.gif][]

Week View:

![bc91bb04e6e9c61e24c974e4440db8f2.gif][]

Month View:

![bc91bb04e6e9c61e24c974e4440db8f2.gif][]

List (Agenda) View

![bc91bb04e6e9c61e24c974e4440db8f2.gif][]

Wijmo Calendar http://wijmo.com/widgets/wijmo-complete/events-calendar/

API：http://wijmo.com/wiki/index.php/Events\_Calendar

Wijmo Calendar 依赖下面的JavaScript库:jquery.ui.core.jsjquery.ui.widget.jsglobalize.jsjquery.mousewheel.jsjquery.plugin.wijtextselection.jsjquery.wijmo.wijutil.jsjquery.wijmo.wijinputcore.jsjquery.wijmo.wijinputdate.jsjquery.wijmo.wijinputnumber.jsjquery.wijmo.wijcalendar.jsjquery.wijmo.wijdialog.jsjquery.wijmo.wijcombobox.jsjquery.wijmo.wijdatepager.js

需要进行用户自定制数据存储时，需要引入下面这两个库:amplify.core.jsamplify.store.js

使用非常简单的代码就可以初始化一个Event Calendar了:

\---------$(document).ready(function () \{$("\#eventscalendar").wijevcal();\});

\----------

下载本文示例代码.

Wijmo Event Calendar 还提供了其它强大的API, 使用户可以方便的定制控件:

设置 Culture:

\----------$("\#eventscalendar").wijevcal(\{ culture: " de-DE");

\----------

设置 data source web service:

\---------$("\#report").wijevcal(\{webServiceUrl: "http://mysite/c1evcalservice.ashx"\});

\--------