我正在开发一个使用 jQuery 插件 Fullcalendar 的小应用程序。这个插件非常好，但现在我需要对其进行轻微的更改。
存储事件后，它会显示在日历上，并且默认情况下单击该事件会显示一 strip 有事件标题的警报。我想要发生的是让点击事件在我的日历 Controller 上调用一个操作。
我使用 fullcalendar.js 的 javascript 以及我自己的 javascript 库:
function padDigits(n, totalDigits) {
n = n.toString();
var pd = '';
if (totalDigits > n.length) {
for (i = 0; i < (totalDigits - n.length); i++) {
pd += '0';
}
}
return pd + n.toString();
}
function createEvent(date, allDay, jsEvent, View) {
var eventDate = padDigits(date.getMonth() + 1, 2) + '-' +
padDigits(date.getDate(), 2) + '-' +
padDigits(date.getFullYear(), 4);
window.location.href = "/Calendar/Create/" + eventDate;
}
$(document).ready(function () {
$('#calendar').fullCalendar({
editable: true,
events: $('#calendar').data('url'), /*"/Calendar/GetEvents",*/
eventClick: "/Calendar/ReviewApproveBooking",
dayClick: function (date, allDay, jsEvent, view) {
createEvent(date, allDay, jsEvent, view);
}
});
});
eventClick 是我想要调用电话的地方。
Action 如下:
[HttpGet]
[Authorize(Roles="Admin")]
public ActionResult ReviewApproveBooking()
{
var booking = from b in DBContext.Events
where b.EventID == 1
select b;
var em = booking.Single();
Guid memberKey = em.MemberID;
MembershipUser mu_booker = Membership.GetUser(memberKey);
ProfileModel pm = ProfileModel.GetProfile(mu_booker.UserName);
em.BookerName = pm.FullName;
return View(em);
}
[HttpPost]
[Authorize(Roles="Admin")]
public ActionResult ReviewApproveBooking(int id, EventModel em)
{
// get the actual user ID
// Need to complete - I know this is blank
return View();
}
我已经为此工作了一天，但我不知道需要做什么才能完成这项工作。非常感谢任何帮助。
非常感谢 纳特吉07
最佳答案
简而言之，如果我是正确的，您只需在单击事件时进行 ajax 调用，查看文档，这相当简单......
首先，您需要通过 ajax 调用调用 [Post] 方法，我将向您展示下面的 jquery 代码:
The docs say this..
$('#calendar').fullCalendar({
eventClick: function(calEvent, jsEvent, view) {
alert('Event: ' + calEvent.title);
alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
alert('View: ' + view.name);
// change the border color just for fun
$(this).css('border-color', 'red');
}
});
$('#calendar').fullCalendar({
eventClick: function(calEvent, jsEvent, view) {
$.ajax({
url: _url,
type: "POST",
cache: false,
data: { id= "", }, *//sort out your params here*
error: function(xhr, status, error) {
//handle errors
},
success: function(data) {
//handle sucess here
} // end on sucess
}); // end ajax call
}
});
关于javascript - 从 FullCalendar 调用 Controller 操作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8228427/