将aj从ajax调用返回到按钮

时间:2018-02-01 21:38:33

标签: javascript jquery ajax

我的应用程序有一个日历,显示约会的详细信息。

我想拥有它,当用户点击按钮时,它将返回该特定约会的详细信息。我正在使用AJAX调用详细信息和jQuery来执行我日历上的操作。

这是我的AJAX调用以及我的jQuery:

    

@section Scripts{
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.4.0/fullcalendar.min.js"></script>

$(document).ready(function () {
        var events = [];
        $.ajax({
            type: "GET",
            url: "/home/GetEvents",
            success: function (data) {
                $.each(data, function (i, v) {
                    events.push({
                        details: v.DetailsOfAppointment,
                        date: moment(v.DateOfAppointment),
                        room: v.RoomType,
                        confirmed: v.Confirmed,
                        church: v.Church.Name,
                        //color: v.ThemeColor,
                        parishAdmin: v.Admins.AdministratorName,
                        id: v.AppointmentId
                    });
                })

                GenerateCalender(events);
            },
            error: function (error) {
                alert('failed');
            }
        })

        function GenerateCalender(events) {
            $('#calender').fullCalendar('destroy');
            $('#calender').fullCalendar({
                contentHeight: 400,
                defaultDate: new Date(),
                header: {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month,basicWeek,basicDay,agenda'
                },
                timeFormat: 'HH:mm',
                eventLimit: true,
                eventColor: events.color,
                events: events,
                eventClick: function (calEvent, jsEvent, view) {
                    $('#myModal #details').text(calEvent.details);
                    var $details = $('<div/>');

                    $details.append($('<p/>').html('<b>Date of Appointment : </b>' + calEvent.date.format("DD-MMM-YYYY HH:mm a")));
                    if (calEvent.end != null) {
                        $details.append($('<p/>').html('<b>End:</b>' + calEvent.end.format("DD-MMM-YYYY HH:mm a")));
                    }
                    $details.append($('<p/>').html('<b>Details : </b>' + calEvent.details));
                    $details.append($('<p/>').html('<b>Church Name : </b>' + calEvent.church));
                    if (calEvent.room != null)
                    {
                        $details.append($('<p/>').html('<b>Room : </b>' + calEvent.room));
                    }
                    else {
                        $details.append($('<p/>').html('<b>Room Not Confirmed'));
                    }

                    $details.append($('<p/>').html('<b>Parish Admin : </b>' + calEvent.parishAdmin));
                    if (calEvent.confirmed == true)
                    {
                        $details.append($('<p/>').html('<b>Status : Confirmed </b>'));
                    }
                    else
                    {
                        $details.append($('<p/>').html('<b>Status : Not Confirmed </b>'));
                    }
                    $('#myModal #pDetails').empty().html($details);

                    $('#myModal').modal();
                }
            })
        }
    })

我对如何获取AppointmentId并创建一个按钮以将用户带到该特定约会感到困惑。

0 个答案:

没有答案