活动日历在ASP.NET MVC3使用jQuery点击天 [英] Events calendar with clickable days using jQuery in ASP.NET MVC3

问题描述

我要创建一个解决方案，将列出将发生在特定日期的事件，并正在寻找一个日历控件，我可以处理，使只有点击事件的日子里，当然收到此单击事件和处理剩下我自己在我的控制器。
（有点像旧的asp：在Web表单日历服务器端控件）。

I'm about to create a solution that will list events that will occur in specific days, and was looking for a Calendar control that I can deal with to make only the days with events clickable, and of course receive this click event and handle the rest myself in my Controller. (something like the old asp:Calendar server-side control in Webforms).

有没有符合这个情况的？

is there any that match this scenario?

更新：什么，我正好要找的是一个迷你日历，不是一个完整的日历像在Outlook中

Update: What I'm exactly looking for is a Mini Calendar, not a full Calendar like the one in Outlook.

这就是我究竟在寻找：

推荐答案

jQuery UI的可以做你想要的精确造型。（和功能的）

jQuery UI can do the exact styling you want.. (and functionality)

您将需要下载的的 jQuery UI的的脚本，并在的平滑度的主题^{（访问 http://jqueryui.com/download/ ，然后选择核心和日期选择器从单选按钮，然后从下拉平滑向右的）}

You will need to download the jQuery UI script and the Smoothness theme ^{(visit http://jqueryui.com/download/ and select core and datepicker from the radio buttons, and smoothness from the drop-down to the right)}

HTML

<div id="datepicker"></div>

的JavaScript

var activeDays=[1,4,10,21,22,23,27,28,30];

$('#datepicker').datepicker(
    {
        beforeShowDay: function(date) {
            var hilight = [false,''];

            if ( activeDays.indexOf( date.getDate() ) > -1)
            {
                hilight = [true,'isActive'];
            }

            return hilight;
        }
    }
);

的 activeDays 变量可以直接持有时间（而不是仅仅一天多的的），你将需​​要改变功能，里面的条件检查匹配。

The activeDays variable could hold dates directly (instead of just the day number) and you would need to alter the conditional inside the function to check for a match.

的 isActive 是用于控制活动日期的造型一类。

The isActive is a class used to control the styling of the active dates..

.isActive a.ui-state-default{
    background:none;
    background-color:pink;
}

是在活生生的例子 http://jsfiddle.net/gaby/C95nx/2/

以上code和例如呈现为

the above code and example renders as

这篇关于活动日历在ASP.NET MVC3使用jQuery点击天的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！