Jquery 完整日历 - 单击上一个和下一个时要作为参数传递给数据库的月份名称



Team,

我是jquery和C#的新手。我正在尝试将 jquery 完整日历插件与 C# 中的代码集成,以显示公司资源占用的叶子。数据库中有超过 10,000 条记录,我想按财政年度和财政月进行过滤。因此,我想在单击上一个和下一个按钮时将这两个参数传递给 C# 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;
}

任何人都可以提出任何更改吗?

Fullcalendar 在发出数据请求时都会传递 2 个 GET 参数,如果将 (DateTime start, DateTime 结束( 添加到 GetEvents 方法,则可以筛选给定范围的数据。

https://fullcalendar.io/docs/event_data/events_json_feed/

我之前认为该控件面临着在日历上填充大约 700-800 条事件记录的限制。在进一步调查时,我偶然发现了一段要放在web.config中的代码。这基本上最大化了 json序列化字符串的长度。

<system.web.extensions>
<scripting>
<webServices>
<jsonSerialization maxJsonLength="50000000"/>
</webServices>
</scripting>
</system.web.extensions> 

最新更新