问题描述
我正在使用 syncfusion-react-scheduler 包并尝试在我向日历添加事件(没有外部按钮)并将事件添加到我的数据库时使用 react 发出发布请求。 我想从你们那里得到解决方案,非常感谢!
解决方法
来自 Syncfusion 支持的问候..!
我们已经根据您的共享查询准备了一个 CRUD 示例“尝试在将事件添加到日历(没有外部按钮)并将事件添加到我的数据库时,使用 react 发出发布请求”使用 UrlAdaptor 对 Scheduler 约会执行 CRUD 操作,可从以下链接下载。
服务:https://www.syncfusion.com/downloads/support/directtrac/308326/ze/Service2137417074 示例:https://stackblitz.com/edit/react-scheduler-crud-sample?file=index.js UGlink:https://ej2.syncfusion.com/react/documentation/schedule/data-binding/#scheduler-crud-actions
服务器端代码段:
ScheduleDataDataContext db = new ScheduleDataDataContext();
public ActionResult Index()
{
return View();
}
public JsonResult LoadData(Params param) // Here we get the Start and End Date and based on that can filter the data and return to Scheduler
{
var data = db.ScheduleEventDatas.Where(app => (app.StartTime >= param.StartDate && app.StartTime <= param.EndDate) || (app.RecurrenceRule != null && app.RecurrenceRule != "")).ToList(); // Here filtering the events based on the start and end date value.
return Json(data,JsonRequestBehavior.AllowGet);
}
public class Params
{
public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
}
[HttpPost]
public JsonResult UpdateData(EditParams param)
{
if (param.action == "insert" || (param.action == "batch" && param.added != null)) // this block of code will execute while inserting the appointments
{
var value = (param.action == "insert") ? param.value : param.added[0];
int intMax = db.ScheduleEventDatas.ToList().Count > 0 ? db.ScheduleEventDatas.ToList().Max(p => p.Id) : 1;
DateTime startTime = Convert.ToDateTime(value.StartTime);
DateTime endTime = Convert.ToDateTime(value.EndTime);
ScheduleEventData appointment = new ScheduleEventData()
{
Id = intMax + 1,StartTime = startTime,EndTime = endTime,Subject = value.Subject,Location = value.Location,Description = value.Description,IsAllDay = value.IsAllDay,StartTimezone = value.StartTimezone,EndTimezone = value.EndTimezone,RecurrenceRule = value.RecurrenceRule,RecurrenceID = value.RecurrenceID,RecurrenceException = value.RecurrenceException,GroupID = value.GroupID
};
db.ScheduleEventDatas.InsertOnSubmit(appointment);
db.SubmitChanges();
}
if (param.action == "update" || (param.action == "batch" && param.changed != null)) // this block of code will execute while updating the appointment
{
var value = (param.action == "update") ? param.value : param.changed[0];
var filterData = db.ScheduleEventDatas.Where(c => c.Id == Convert.ToInt32(value.Id));
if (filterData.Count() > 0)
{
DateTime startTime = Convert.ToDateTime(value.StartTime);
DateTime endTime = Convert.ToDateTime(value.EndTime);
ScheduleEventData appointment = db.ScheduleEventDatas.Single(A => A.Id == Convert.ToInt32(value.Id));
appointment.StartTime = startTime;
appointment.EndTime = endTime;
appointment.StartTimezone = value.StartTimezone;
appointment.EndTimezone = value.EndTimezone;
appointment.Subject = value.Subject;
appointment.Location = value.Location;
appointment.Description = value.Description;
appointment.IsAllDay = value.IsAllDay;
appointment.RecurrenceRule = value.RecurrenceRule;
appointment.RecurrenceID = value.RecurrenceID;
appointment.RecurrenceException = value.RecurrenceException;
appointment.GroupID = value.GroupID;
}
db.SubmitChanges();
}
if (param.action == "remove" || (param.action == "batch" && param.deleted != null)) // this block of code will execute while removing the appointment
{
if (param.action == "remove")
{
int key = Convert.ToInt32(param.key);
ScheduleEventData appointment = db.ScheduleEventDatas.Where(c => c.Id == key).FirstOrDefault();
if (appointment != null) db.ScheduleEventDatas.DeleteOnSubmit(appointment);
}
else
{
foreach (var apps in param.deleted)
{
ScheduleEventData appointment = db.ScheduleEventDatas.Where(c => c.Id == apps.Id).FirstOrDefault();
if (apps != null) db.ScheduleEventDatas.DeleteOnSubmit(appointment);
}
}
db.SubmitChanges();
}
var data = db.ScheduleEventDatas.ToList();
return Json(data,JsonRequestBehavior.AllowGet);
}
public class EditParams
{
public string key { get; set; }
public string action { get; set; }
public List<ScheduleEventData> added { get; set; }
public List<ScheduleEventData> changed { get; set; }
public List<ScheduleEventData> deleted { get; set; }
public ScheduleEventData value { get; set; }
}
客户端片段:
this.dataManger = new DataManager({
url: "http://localhost:54738/Home/LoadData",// Here need to mention the web api sample running path
crudUrl: "http://localhost:54738/Home/UpdateData",crossDomain: true,adaptor: new UrlAdaptor()
});
请尝试上述 CRUD 示例,如果您需要任何进一步的帮助,请联系我们。
问候,
哈雷什