团队,jquery完整日历 - 单击prev和next时将月份名称作为参数传递给数据库
我是jquery和C#的新手。我正在尝试将jquery完整的日历插件与C#中的代码整合,以显示公司资源占用的叶子。数据库中有超过10,000条记录,我希望按照会计年度和财政月度进行过滤。因此,我想当我点击prev和next按钮时,将两个参数传递给C#db代码(年和月)。
我能够显示在日历上从DB第500行(我想我不能显示更重要的是 - 似乎是一个限制)
下面是代码
js代码
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
type: "POST",
contentType: "application/json",
data: "{}",
url: "CalendarPage.aspx/GetEvents",
dataType: "json",
success: function (data) {
$('div[id*=fullcal]').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
editable: true,
events: $.map(data.d, function (item, i) {
//var eventsUrl = '/events/' + end.year() + '/' + parseInt(end.month());
var event = new Object();
event.id = item.EventID;
event.start = new Date(item.StartDate);
event.end = new Date(item.EndDate);
event.title = item.EventName;
event.url = item.Url;
event.ImageType = item.ImageType;
return event;
}), eventRender: function (event, eventElement) {
if (event.ImageType) {
if (eventElement.find('span.fc-event-time').length) {
eventElement.find('span.fc-event-time').before($(GetImage(event.ImageType)));
} else {
eventElement.find('span.fc-event-title').before($(GetImage(event.ImageType)));
}
}
},
loading: function (bool) {
if (bool) $('#loading').show();
else $('#loading').hide();
}
});
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
debugger;
}
});
$('#loading').hide();
$('div[id*=fullcal]').show();
});
function GetImage(type) {
if (type == 0) {
return "<br/><img src = 'Styles/Images/attendance.png' style='width:24px;height:24px'/><br/>"
}
else if (type == 1) {
return "<br/><img src = 'Styles/Images/not_available.png' style='width:24px;height:24px'/><br/>"
}
else
return "<br/><img src = 'Styles/Images/not_available.png' style='width:24px;height:24px'/><br/>"
}
</script>
C#代码
[WebMethod]
public static IList GetEvents()
{
Leave_Management_Leave_TakenTableAdapter LTTA = new Leave_Management_Leave_TakenTableAdapter();
DB.Leave_Management_Leave_TakenDataTable LTTbl = null;
**LTTbl = LTTA.GetForCalendar("I wish to put the parameters here");**
IList events = new List<Event>();
foreach(DataRow dr in LTTbl.Rows)
{
events.Add(new Event
{
EventName = dr["Fullname"] + " Leave",
// DateTime dt = ,
StartDate = DateTime.Parse(dr["leave_days"].ToString()).ToString("MM-dd-yyyy")
});
}
return events;
}
任何人都可以请建议什么变化?
感谢您的更新。我已经尝试过..但是,当我点击左上角的上一个/下一个按钮后,我会需要。当我单击prev下一个按钮时,GetEvents webservice方法不会接到呼叫。有没有办法做到这一点? –
而不是进行ajax调用,然后初始化日历允许日历自己做。如果您将日历的events选项设置为您的url并从web方法返回json,它仍然会像您期望的那样填充日历,但是当您单击上一个或下一个时,它将调用传递2 GET参数的相同url。如果你看看我提供的答案中的链接,可以进一步解释这一点。 –
感谢您的解决方案。我实现了你的并通过了它。不过,我找到了更多的方法。它的工作原理是一个简单的解决方案,以在日历中引入最大数量的事件。请注意,最多只有500个活动被填充,我觉得这是对照的限制。解决方案如下所述。 –