Fullcalendar MVC 未传递 ID
Posted
技术标签:
【中文标题】Fullcalendar MVC 未传递 ID【英文标题】：Fullcalendar MVC not passing ID 【发布时间】：2021-11-20 14:08:55 【问题描述】：我正在按照在线教程在我的项目中实现完整日历。
这是删除事件：
public JsonResult GetEvents()
using (_context)
var events = _context.CalendarEvents.ToList();
return new JsonResult Data = events, JsonRequestBehavior = JsonRequestBehavior.AllowGet ;
[HttpPost]
public JsonResult SaveEvent(CalendarEvents e)
var status = false;
using (_context)
if (e.CalendarID > 0)
//Update the event
var v = _context.CalendarEvents.Where(a => a.CalendarID == e.CalendarID).FirstOrDefault();
if (v != null)
v.CalendarID = e.CalendarID;
v.Subject = e.Subject;
v.Start = e.Start;
v.End = e.End;
v.Description = e.Description;
v.ThemeColor = e.ThemeColor;
else
_context.CalendarEvents.Add(e);
_context.SaveChanges();
status = true;
return new JsonResult Data = new status = status ;
[HttpPost]
public JsonResult DeleteEvent(int eventID)
var status = false;
using (_context)
var v = _context.CalendarEvents.FirstOrDefault(a => a.CalendarID == eventID);
if (v != null)
_context.CalendarEvents.Remove(v);
_context.SaveChanges();
status = true;
return new JsonResult Data = new status = status ;
这是JS：
$(document).ready(function()
var events = [];
var selectedEvent = null;
FetchEventAndRenderCalendar();
function FetchEventAndRenderCalendar()
events = [];
$.ajax(
type: "GET",
url: "/home/GetEvents",
success: function(data)
$.each(data,
function(i, v)
events.push(
eventID: v.EventID,
title: v.Subject,
description: v.Description,
start: moment(v.Start),
end: v.End != null ? moment(v.End) : null,
color: v.ThemeColor,
allDay: v.IsFullDay
);
)
GenerateCalender(events);
,
error: function(error)
alert('failed');
)
function GenerateCalender(events)
$('#calender').fullCalendar('destroy');
$('#calender').fullCalendar(
contentHeight: 680,
defaultDate: new Date(),
timeFormat: 'h(:mm)a',
header:
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay,agenda'
,
eventLimit: true,
eventColor: '#378006',
events: events,
eventClick: function(calEvent, jsEvent, view)
selectedEvent = calEvent;
$('#myModal #eventTitle').text(calEvent.title);
var $description = $('<div/>');
$description.append($('<p/>').html('<b>Start:</b>' + calEvent.start.format("DD-MMM-YYYY HH:mm a")));
if (calEvent.end != null)
$description.append($('<p/>').html('<b>End:</b>' + calEvent.end.format("DD-MMM-YYYY HH:mm a")));
$description.append($('<p/>').html('<b>Description:</b>' + calEvent.description));
$('#myModal #pDetails').empty().html($description);
$('#myModal').modal();
,
selectable: true,
select: function(start, end)
selectedEvent =
eventID: 0,
title: '',
description: '',
start: start,
end: end,
allDay: false,
color: ''
;
openAddEditForm();
$('#calendar').fullCalendar('unselect');
,
editable: true,
eventDrop: function(event)
var data =
EventID: event.eventID,
Subject: event.title,
Start: event.start.format('DD/MM/YYYY'),
End: event.end != null ? event.end.format('DD/MM/YYYY') : null,
Description: event.description,
ThemeColor: event.color,
IsFullDay: event.allDay
;
SaveEvent(data);
)
$('#btnEdit').click(function()
//Open modal dialog for edit event
openAddEditForm();
)
$('#btnDelete').click(function()
console.log(selectedEvent);
if (selectedEvent != null && confirm('Are you sure?'))
$.ajax(
type: "POST",
url: '/home/DeleteEvent',
data: 'eventID': selectedEvent.eventID ,
success: function(data)
if (data.status)
//Refresh the calender
FetchEventAndRenderCalendar();
$('#myModal').modal('hide');
,
error: function()
alert('Failed');
);
);
$('#dtp1,#dtp2').datetimepicker(
format: 'DD/MM/YYYY HH:mm A'
);
$('#chkIsFullDay').change(function()
if ($(this).is(':checked'))
$('#divEndDate').hide();
else
$('#divEndDate').show();
);
function openAddEditForm()
console.log(selectedEvent);
if (selectedEvent != null)
$('#hdEventID').val(selectedEvent.eventID);
$('#txtSubject').val(selectedEvent.title);
$('#txtStart').val(selectedEvent.start.format('DD/MM/YYYY'));
$('#chkIsFullDay').prop("checked", selectedEvent.allDay || false);
$('#chkIsFullDay').change();
$('#txtEnd').val(selectedEvent.end != null ? selectedEvent.end.format('DD/MM/YYYY') : '');
$('#txtDescription').val(selectedEvent.description);
$('#ddThemeColor').val(selectedEvent.color);
FetchEventAndRenderCalendar();
$('#myModal').modal('hide');
$('#myModalSave').modal();
$('#btnSave').click(function()
//Validation/
if ($('#txtSubject').val().trim() == "")
alert('Subject required');
return;
if ($('#txtStart').val().trim() == "")
alert('Start date required');
return;
if ($('#chkIsFullDay').is(':checked') == false && $('#txtEnd').val().trim() == "")
alert('End date required');
return;
else
var startDate = moment($('#txtStart').val(), "DD/MM/YYYY").toDate();
var endDate = moment($('#txtEnd').val(), "DD/MM/YYYY").toDate();
if (startDate > endDate)
alert('Invalid end date');
return;
var data =
EventID: $('#hdEventID').val(),
Subject: $('#txtSubject').val().trim(),
Start: $('#txtStart').val().trim(),
End: $('#chkIsFullDay').is(':checked') ? null : $('#txtEnd').val().trim(),
Description: $('#txtDescription').val(),
ThemeColor: $('#ddThemeColor').val(),
IsFullDay: $('#chkIsFullDay').is(':checked')
SaveEvent(data);
// call function for submit data to the server
)
function SaveEvent(data)
$.ajax(
type: "POST",
url: '/home/SaveEvent',
data: data,
success: function(data)
if (data.status)
//Refresh the calender
FetchEventAndRenderCalendar();
$('#myModalSave').modal('hide');
,
error: function()
alert('Failed');
)
)
运行时我打开了 Fiddler，它只是运行 DeleteEvent 但 ID 不存在，带有 console.log(selectedEvent);除了 ID，所有数据都在那里。
任何帮助都会很棒！
谢谢
【问题讨论】：
selectedEvent 来自哪里？目前尚不清楚您如何定义它或它应该包含什么。登录后是什么样子的？为什么您希望它包含 eventID 属性？从您到目前为止所写的内容来看，尚不清楚。请提供问题的minimal reproducible example，否则我们真的无能为力帮助您。谢谢。
对不起 ADyson，我已经更新了我的代码以包含所有 JS 和 Controller 代码。当我单击事件并删除它时，它正在运行代码，但不提供 eventID 以删除 SQL 中的记录。
【参考方案1】：
看起来我应该休息一下，问题 eventID 需要是 CalendarID。感谢您查看 ADyson。
【讨论】：
以上是关于Fullcalendar MVC 未传递 ID的主要内容，如果未能解决你的问题，请参考以下文章
将值从 fullCalendar 单击传递到 Django 模板
如何传递具有多个标题的php数组并开始到fullCalendar 3