专栏首页葡萄城控件技术团队Wijmo 更优美的jQuery UI部件集:活动日历控件(Event Calendar)

Wijmo 更优美的jQuery UI部件集:活动日历控件(Event Calendar)

  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

Week View:

Month View:

List (Agenda) View

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.js

jquery.ui.widget.js

globalize.js

jquery.mousewheel.js

jquery.plugin.wijtextselection.js

jquery.wijmo.wijutil.js

jquery.wijmo.wijinputcore.js

jquery.wijmo.wijinputdate.js

jquery.wijmo.wijinputnumber.js

jquery.wijmo.wijcalendar.js

jquery.wijmo.wijdialog.js

jquery.wijmo.wijcombobox.js

jquery.wijmo.wijdatepager.js

需要进行用户自定制数据存储时,需要引入下面这两个库:

amplify.core.js

amplify.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"

});

--------

设置 星期的第一天:

--------

$("#eventscalendar").wijevcal({ firstDayOfWeek: 1 });

--------

设置 header Bar 是否显示

-------

$("#element").wijevcal({ headerBarVisible: false });

-------

设置navigation Bar 是否显示

-------

$("#element").wijevcal({navigationBarVisible: false });

-------

设置右边 Panel 是否显示

-------

$("#element").wijevcal({rightPaneVisible: false });

-------

还有很多其它实用的API:

http://wijmo.com/wiki/index.php/Events_Calendar

下载本文示例代码

Wijmo下载,请进入Studio for ASP.NET Wijmo 2012 v1正式发布(2012.03.22更新)!

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 提高性能:用RequireJS优化Wijmo Web页面

    上周Wijmo 2014 V2版本刚刚发布(下载地址),  有网友下载后发现仅仅使用了40个Widgets的一小部分,还需要加载全部的jquery.wijmo-...

    葡萄城控件
  • Webpack 4教程 - 第四部分,使用SplitChunksPlugin分离代码

    Webpack 4 给我们带来了一些变化。其中包括更快地打包,引入了SplitChunksPlugin,并淘汰掉之前的CommomsChunksPlugin。在...

    葡萄城控件
  • Wyn Enterprise商业智能分析软件正式发布,将BI和报表融为一体

    近日,葡萄城正式发布Wyn Enterprise 商业智能分析软件,这是一款前所未有的商业智能软件,将 BI 和报表融为一体。

    葡萄城控件
  • 使用Python将两张照片透明重叠

    透明重叠最主要用的是Image.blend方法(详情请看第二个代码块), 第一个代码块主要是将多个图片剪切到一张大图, 然后用这张大图和另外一张非剪切的大图进行...

    用户1416054
  • npm install报错,以及Cannot find module 'fabric-ca-client'问题解决

    运行~/go/src/github.com/hyperledger/fabric/scripts/fabric-samples/fabcar$ ./startF...

    红桃K
  • mall在Windows环境下的部署

    1.关于IDEA的安装与使用具体参考https://github.com/judasn/IntelliJ-IDEA-Tutorial

    macrozheng
  • 机器人带着VR学习,最后学会了人工智能

    新创公司Embodied Intelligence日前发表神经网络编程软件,能让机器人随时间演进而提升其效能。预计在接下来的几个月,采用这一软件工具的工业机器人...

    企鹅号小编
  • 春晚爆红的智能机器人阿尔法大起底

    要问哪个节目吐槽的人最多,恐怕要数央视春晚了,看的人也一年少过一年。今年的春晚,你看了吗?如果没有看,你可能错过了一场精彩绝伦的表演,表演者不是艺术家,而是54...

    机器人网
  • npm、npm scripts

    小胖
  • cordova学习一 环境搭建

    环境(个人版本):   node.js     v6.9.5   cordova   6.5.0   jdk            1.8.0_66 1.1no...

    cfs

扫码关注云+社区

领取腾讯云代金券