如何将全日历数据"发布"回服务器？

Question

我正在将FullCalendar集成到Web表单中.

FullCalendar从隐藏的表单字段中获取数据.像这样:

var data = jQuery.parseJSON(jQuery('#fullcalendar_data').val());

然后FullCalendar做得很棒,让用户编辑.

用户完成后,单击表单上的"保存".

如何将FullCalendar的事件数据作为JSON返回到隐藏的表单字段中,以便"保存"将其发回服务器？

Answer 1

使用此代码从日历中获取事件:

<script type='text/javascript'>
function savedata(){
$(document).ready(function () {
    $(function () {
        $("#save").click(function () {
            var eventsFromCalendar = $('#calendar').fullCalendar('clientEvents');
            alert(eventsFromCalendar);
            $.ajax(
        {

            url: '@Url.Action("Save")',
            type: 'POST',
            traditional: true,
            data: { eventsJson: JSON.stringify(eventsFromCalendar) },
            dataType: "json",
            success: function (response) {
                alert(response);
            },
            error: function (xhr) {
                debugger;
                alert(xhr);
            }

        });
        });
    });
});
 }
 </script> 

并使控制器方法接收如下数据:

[HttpPost]
public ActionResult Save(string eventsJson)
{
var events = JsonConvert.DeserializeObject<IEnumerable<Event>>(eventsJson);
return View();
}

 public class Event
{
    public int Id { get; set; }



    public string Title { get; set; }
    public DateTime Start { get; set; }
    public DateTime End { get; set; }
}

你可以在你的页面上的任何事件上调用这个java脚本函数,如onclick,使它成为一个函数等.