如何解决数据库中保存的时间与Fullcalendar上显示的时间不同
我正在使用带有MVC的FullCalendar.io库（版本3）。所有事件都保存在数据库中。例如，我在9：am有一个事件，但是它将在日历的不同时间显示。 这是我在桌子上的活动
您可以看到它开始于2020-09-16的9:00，但是我这次在Calendar上看到了。它显示8:30。 我的虚拟主机位于美国，但我在亚洲。 这是我在FullCalendar中看到的
这是视图：
$(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.ID,title: v.FullName,firstName: v.FirstName,lastName: v.LastName,phone: v.Phone,description: v.Description,start: moment(v.Start),end: moment(v.End),end: v.End,color: v.ThemeColor,allDay:false,custId:v.CustID
});
})
GenerateCalender(events);
},error: function (error) {
alert('failed');
}
})
}
function GenerateCalender(events) {
$('#calender').fullCalendar('destroy');
$('#calender').fullCalendar({
locale: 'it',contentHeight: 600,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').html(calEvent.lastName + ' ' + calEvent.firstName + '<br>' + calEvent.phone);
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) {
$('#txtFirstName').val('');
$('#txtLastName').val('');
$("#txtCustomerId").val(0);
$("#txtPhone").val('');
selectedEvent = {
eventID: 0,fullName: '',lastName: '',firstName: '',description: '',start: start,end: end,allDay: false,color: '',Custd: 0
};
modaltest();
openAddEditForm();
},editable: true
});
}
}
这是控制器
public JsonResult GetEvents()
{
using (SalonEntities dc = new SalonEntities())
{
var events = dc.View_EventsFull.ToList();
return new JsonResult { Data = events,JsonRequestBehavior = JsonRequestBehavior.AllowGet};
}
}
为什么日历上没有显示数据库中存储的确切时间和日期？
--------------------------------- 编辑部分 ---------------------------------
这是我保存数据的部分。 （在视图中）
$('#btnSave').click(function () {
var startDate = moment($('#txtStart').val(),"DD/MM/YYYY HH:mm A").toDate();
var endDate = moment($('#txtEnd').val(),"DD/MM/YYYY HH:mm A").toDate();
if (startDate > endDate) {
alert("Invalid end date");
return;
}
var data = {
ID: $('#hdEventID').val(),FirstName: $('#txtFirstName').val().trim(),LastName: $('#txtLastName').val().trim(),Phone: $('#txtPhone').val().trim(),Start: $('#txtStart').val().trim(),End: $('#txtEnd').val().trim(),Description: $('#txtDescription').val(),ThemeColor: $('#ddThemeColor').val(),IsFullDay:false,CustID:$('#txtCustomerId').val()
}
SaveEvent(data);
})
function SaveEvent(data) {
$.ajax({
type: "POST",url: '/home/SaveEvent',data: data,success: function (data) {
if (data.status) {
FetchEventAndRenderCalendar();
$('#myModalSave').modal('hide');
}
},error: function () {
alert('Failed');
}
})
}
在Controller中保存数据的功能是
public JsonResult SaveEvent(View_EventsFull e)
{
var status = false;
using (SalonEntities dc = new SalonEntities())
{
if (e.ID > 0)
{
//Update the event
var v = dc.Events.Where(a => a.ID == e.ID).FirstOrDefault();
if (v != null)
{
v.Start = e.Start;
v.End = e.End;
v.Description = e.Description;
v.IsFullDay = false;
v.ThemeColor = e.ThemeColor;
v.CustID = e.CustID;
}
}
else
{
Event eventItem = new Event();
eventItem.CustID =e.CustID;
eventItem.Start = e.Start;
eventItem.End = e.End;
eventItem.Description = e.Description;
eventItem.IsFullDay = false;
eventItem.ThemeColor = e.ThemeColor;
dc.Events.Add(eventItem);
}
dc.SaveChanges();
status = true;
}
return new JsonResult { Data = new { status = status } };
}
这是在控制器的GetEvents中创建的Json
[{“ ID”：22，“描述”：“测试1”，“开始”：“ /日期（1600272000000）/”，“结束”：“ /日期（1600275600000）/”，“主题颜色”： “ red”，“ IsFullDay”：false，“ FullName”：“ Ms Noosh”，“ Phone”：“ 0912”，“ CustID”：10，“ FirstName”：“ Noosh”，“ LastName”：“ Ms”}]
解决方法
问题是这种格式，例如/Date(1600272000000)/代表自1970年以来的滴答声数量，而不是描述特定日期/时间的字符串。它不会告诉您确切的时间，也不会告诉您最初输入日期的时区。因此，当momentJS进行解析时，它会将其转换成一个日期，该日期描述浏览器中与该滴答数相关的本地时间。
如果仅希望应用程序始终将日期视为同一时区，则可以在JSON中输出纯ISO日期。如果您可以将MVC中的JSON序列化程序切换到JSON.NET，则默认情况下可以执行此操作。或者，您可以通过将日期属性转换为模型中的字符串类型来解决此问题。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。