如何获取点击的事件 ID 并使用这些详细信息导航到 ASPX 页面? (全日历)

How to get clicked event id and navigate to ASPX page with those details? (FullCalendar)

我正在开发混合项目,我在 MVC 下使用 FullCalendar,但所有其他页面都使用 Webforms。当我单击一个事件时,它会正常显示它的详细信息。没有问题。我刚刚在 'eventClick' 模式中添加了一个按钮 'More Details',我可以在其中跳转到以更详细的形式显示事件详细信息的 ASPX 页面。我一直在想办法,但我似乎找不到办法。有什么建议吗?

Picture of 'eventClick' Modal

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

<script>
    $(document).ready(function () {
        var events = [];
        $.ajax({
            type: "GET",
            url: "/home/GetEvents",
            success: function (data) {
                $.each(data, function (i, v) {
                    events.push({
                        title: v.EquipID,
                        modelno: v.ModelNo,
                        description: v.ModelDesc,
                        caltype: v.CalType,
                        start: moment(v.EquipApprovedDate),
                        end: v.EquipCalDueDate != null ? moment(v.EquipCalDueDate) : null,
                        color: v.ThemeColor,
                        allDay: v.IsFullDay
                    });
                })

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

        function GenerateCalender(events) {
            $('#calender').fullCalendar('destroy');
            $('#calender').fullCalendar({
                contentHeight: 400,
                defaultDate: moment('@(ViewBag.eqStartDate)'),
                timeFormat: 'h(:mm)a',
                displayEventTime: false,
                header: {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month,basicWeek,basicDay,agenda'
                },
                eventLimit: true,
                eventColor: '#378006',
                events: events,
                eventClick: function (calEvent, jsEvent, view) {
                    $('#myModal #eventTitle').text(calEvent.title);
                    var $description = $('<div/>');
                    $description.append($('<p/>').html('<b>Model No: </b>' + calEvent.modelno));
                    $description.append($('<p/>').html('<b>Description: </b>' + calEvent.description));
                    $description.append($('<p/>').html('<b>Cal Type: </b>' + calEvent.caltype));
                    $description.append($('<p/>').html('<b>Start: </b>' + calEvent.start.format("DD-MMM-YYYY")));
                    if (calEvent.end != null) {
                        $description.append($('<p/>').html('<b>End: </b>' + calEvent.end.format("DD-MMM-YYYY")));
                    }
                    $('#myModal #pDetails').empty().html($description);

                    $('#myModal').modal();
                },
                eventRender: function eventRender(events, jsEvent, view) {
                    return ['all', events.title].indexOf($('#type_selector').val()) >= 0
                }
            });
            $('#type_selector').on('change', function () {
                $('#calendar').fullCalendar('removeEventSource', events);
                $('#calendar').fullCalendar('addEventSource', events);
                $('#calendar').fullCalendar('refetchEvents');
            });
        }
    })
</script>}

<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title"><span id="eventTitle"></span></h4>
        </div>
        <div class="modal-body">
            <p id="pDetails"></p>
        </div>
        <div class="modal-footer">
        <a type="button" class="btn btn-default" href="" onclick="this.href = 'EqDetails.aspx?idid=' + document.getElementById('eventTitle').value">More Details</a>
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
</div>

另外一个场景我做了一个但是你也可以用同样的方式读出值来显示你需要的数据。您必须处理 Page_Load 部分

然后使用href去页面应该是

<a type="button" class="btn btn-default" href="javascript:;" onclick="javascript:document.location.href='EqDetails.aspx?id='+document.getElementById('eventTitle').innerHTML">More Details</a>