ASP.Net MVC从FullCalendar的javascript函数调用控制器动作而不加载视图

时间:2015-10-23 14:13:16

标签: javascript jquery asp.net-mvc fullcalendar

我正在开发一个ASP.Net MVC应用程序。在我的一个观点中,我使用的是FullCalendar控件。 我的fullcalendar控件有2个问题 - 我的第一个问题是 - 在事件点击功能,我从Javasript函数调用一些其他控制器的动作。我的剧本是 -

    <script>
        $(document).ready(function () {

            var sourceFullView = { url: '/Calendar/GetDiaryEvents/' };
            var sourceSummaryView = { url: '/Calendar/GetDiaryEvents/' };
            var CalLoading = true;

            $('#calendar').fullCalendar({
                header: {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month'
                },
                defaultView: 'month',
                editable: true,
                allDaySlot: false,
                selectable: true,
                slotMinutes: 15,
                events: '/Calendar/GetDiaryEvents/',
                eventClick: function (calEvent, jsEvent, view) {
                    if (!confirm('You selected Election ID: ' + calEvent.title
                        + "\nElection Date: " + calEvent.start.toDateString()
                        + "\n\nDo you want to Vote for this Election?")) {
                        return;
                    }
                    var electionID = calEvent.id;
                    $.ajax({
                        url: '@Url.Action("Tally", "Voting")',
                        type: 'GET',
                        dataType: 'json',
                        cache: false,
                        data: { id: calEvent.id }
                    });
                },

                eventResize: function (event, dayDelta, minuteDelta, revertFunc) {

                    if (confirm("Confirm change appointment length?")) {
                        UpdateEvent(event.id, event.start, event.end);
                    }
                    else {
                        revertFunc();
                    }
                },

                viewRender: function (view, element) {

                    if (!CalLoading) {
                        if (view.name == 'month') {
                            $('#calendar').fullCalendar('removeEventSource', sourceFullView);
                            $('#calendar').fullCalendar('removeEvents');
                            $('#calendar').fullCalendar('addEventSource', sourceSummaryView);
                        }
                    }
                }

            });

            CalLoading = false;


        });

    </script>

这是调用VotingController的Tally方法 -

            [HttpGet]
            public ActionResult Tally(int id)
            {
                return View(id);
            }

当我通过View of Tally进行调试时,它也看起来很好但是从操作Tally调用的新视图未加载,浏览器仍显示我的日历控件。

我的第二个问题是我只想显示月历。当我点击日历上的next或prev按钮时,我的GetDiaryEvents函数被调用三次。

1 个答案:

答案 0 :(得分:0)

尝试在Tally方法中使用JsonResult。您还可以将视图呈现为字符串并将其包含在json返回中。

[HttpGet]
        public JsonResult Tally(int id)
        {   //fill your model
            return Json( new { viewdata=model } );
        }

并且在ajax调用返回时你只需要读取json返回对象

 success: function (return) {
            $("#element").append(return.viewdata);

        }