在 c# mvc 中读取一个 JSON 数据文件以获得完整的日历

Question

我想从我的全日历中的文件中读取 Json 数据。我应该在事件中编写什么代码。我在 C# MVC 中使用完整日历。

$('#calendar').fullCalendar({
    events:['~/Content/vimal.txt'],
});

calendar 工作正常，但我无法从外部文件读取输入。在这段代码中，我正在从 vimal.txt 文件中读取 JSON 数据。

vimal.txt 文件包含，

[
    {
        id: 999,
        title: 'Repeating Event',
        start: '2015-02-09T16:00:00'
    },
    {
        id: 999,
        title: 'Repeating Event',
        start: '2015-02-16T16:00:00'
    },
    {
        title: 'Conference',
        start: '2015-02-11',
        end: '2015-02-13'
    },
    {
        title: 'Meeting',
        start: '2015-02-12T10:30:00',
        end: '2015-02-12T12:30:00'
    },
    {
        title: 'Lunch',
        start: '2015-02-12T12:00:00'
    },
    {
        title: 'Meeting',
        start: '2015-02-12T14:30:00'
    },
    {
        title: 'Happy Hour',
        start: '2015-02-12T17:30:00'
    },
    {
        title: 'Dinner',
        start: '2015-02-12T20:00:00'
    },
    {
        title: 'Birthday Party',
        start: '2015-02-13T07:00:00'
    },
    {
        title: 'Click for Google',
        url: 'http://google.com/',
        start: '2015-02-28'
    }
]

Answer 1

    <!--FullCalendar Dependencies-->
    <link href='fullcalendar/fullcalendar.css' rel='stylesheet' />
    <link href='fullcalendar/fullcalendar.print.css' rel='stylesheet' media='print' />
    <script src='jquery/jquery-1.9.1.min.js'></script>
    <script src='jquery/jquery-ui-1.10.2.custom.min.js'></script>
    <script src='fullcalendar/fullcalendar.min.js'></script>
    <style type="text/css">
        body
        {
            margin-top: 40px;
            text-align: center;
            font-size: 14px;
            font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
        }
        #calendar
        {
            width: 900px;
            margin: 0 auto;
        }
    </style>
    <script type="text/javascript">

        $(document).ready(function()
        {
            var date = new Date();
            var d = date.getDate();
            var m = date.getMonth();
            var y = date.getFullYear();

            var calendar = $('#calendar').fullCalendar(
            {
                header:
                {
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month,agendaWeek,agendaDay'
                },
                defaultView: 'agendaWeek',
                selectable: true,
                selectHelper: true,
                select: function(start, end, allDay)
                {
                    var title = prompt('Event Title:');
                    if (title)
                    {
                        calendar.fullCalendar('renderEvent',
                            {
                                title: title,
                                start: start,
                                end: end,
                                allDay: allDay
                            },
                            true // make the event "stick"
                        );
                    }
                    calendar.fullCalendar('unselect');
                },
                editable: true,
                events: [
                    {
                        title: 'All Day Event',
                        start: new Date(y, m, 1)
                    },
                    {
                        id: 999,
                        title: 'Repeating Event',
                        start: new Date(y, m, d+4, 16, 0),
                        allDay: false
                    },
                    {
                        title: 'Meeting',
                        start: new Date(y, m, d, 10, 30),
                        allDay: false
                    },
                    {
                        title: 'Lunch',
                        start: new Date(y, m, d, 12, 0),
                        end: new Date(y, m, d, 14, 0),
                        allDay: false
                    },
                    {
                        title: 'Birthday Party',
                        start: new Date(y, m, d+1, 19, 0),
                        end: new Date(y, m, d+1, 22, 30),
                        allDay: false
                    },
                    {
                        title: 'Click for Google',
                        start: new Date(y, m, 28),
                        end: new Date(y, m, 29),
                        url: 'http://google.com/'
                    }
                ]
            });

        });

    </script>


<body>
    <div id='calendar'></div>
</body>

事件的右侧：（从具有（id、标题和开始日期、结束数据）的数据库中获取 JSON 数据的任何变量）

在 c# mvc 中读取一个 JSON 数据文件以获得完整的日历

read a JSON data file in c# mvc For full calendar

model-view-controller

jquery

fullcalendar