单击日历时将数据加载到 PartialView (ASP.NET MVC)

Question

我使用全日历插件

我可以点击日历中的日期并从中获取数据

脚本代码如下：

<script>             //Calendar initialization
$(document).ready(function () {
    $('#calendar').fullCalendar({
        header: {
            left: 'prev,next',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        defaultView: 'agendaWeek',
        events:"/Calendar/GetEvents/",
        firstDay: 1,
        selectable: true,
        select: function (start, end, jsEvent, view) {
            $('#right2').load('@Url.Action("SheduleNewAppointment", "Calendar")');
            var allDay = !start.hasTime() && !end.hasTime();
            $("#startAppointment").val(moment(start).format("MM/DD/YYYY HH:mm a"));

        },
        editable: true
    });
});

通过这段代码我可以得到数据

select: function (start, end, jsEvent, view) {
                $('#right2').load('@Url.Action("SheduleNewAppointment", "Calendar")');
                var allDay = !start.hasTime() && !end.hasTime();
                $("#startAppointment").val(moment(start).format("MM/DD/YYYY HH:mm a"));

            },

我的问题是我需要在 select 中打开部分视图并将数据添加到 #startAppointment。是输入

现在打开局部视图，不向输入添加数据。我该怎么做？

更新

如果我通过另一个按钮打开部分视图，然后在部分可见时单击日历，没问题

Answer 1

我同意 Lazys 的评论。您需要了解 ajax 操作（例如 .load）运行 asychronously 以及在调用异步操作的紧下方的行上编写的任何代码都将执行立即，无需等待异步操作完成。

因此，您的代码尝试访问 startAppointment 元素并在该元素实际存在于页面之前设置其值。

如果您有一些运行的代码取决于从 ajax 调用返回的某些数据或标记，那么您必须等待 ajax 调用完成在运行之前。这是确保代码具有正确执行所需的可用值的唯一方法。这通常是通过回调函数来完成的，您将回调函数提供给进行 ajax 调用的代码，然后存储此函数，并且仅在 ajax 调用成功完成时执行。

对于 jQuery 的 .load() 方法，您可以提供回调函数作为 load() 方法本身的参数，如下所示：

$('#right2').load(
  '@Url.Action("SheduleNewAppointment", "Calendar")', 
  function () { //this is the callback function. It's not executed at the time you pass it load, but only after the loading operation (done via ajax) has finished
    var allDay = !start.hasTime() && !end.hasTime(); //I've included this line, although it appears to be redundant, since you never use the "allDay" variable afterwards.
    $("#startAppointment").val(moment(start).format("MM/DD/YYYY HH:mm a"));
  }
});

有关详细信息，请参阅 http://api.jquery.com/load/。

如果你这样做，它保证你的部分页面将加载，包括 startAppointment 元素，在试图访问该元素的 jQuery 代码之前，然后你应该没有问题.

单击日历时将数据加载到 PartialView (ASP.NET MVC)

Load data to PartialView when click on calendar (ASP.NET MVC)

asp.net

asp.net-mvc

jquery

fullcalendar

asp.net-mvc-4