javascript - Full Calendar creating simple event - Stack Overflow

admin管理员组

文章数量:1391977

I am new to using FullCalendar, and I am planning on using JSON to feed it the events but i dont know how to start. I am trying to hard code an event into it just to have an idea of where and how i should be passing it the JSON. Most likely i will create a webservice that has a function that returs the Json format and feed it, but in the meantime. How can i hard code an event. Here is the code I currently have. How and where can I hard code an event below? :

<script type="text/javascript">
    $(document).ready(function () {

        $('#calendar').fullCalendar({
            allDaySlot: false,
            header: {

                left: 'today prev next',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            axisFormat: 'h(:mm)tt',
            timeFormat: { agenda: 'HH:mm{ - HH:mm}' },
            defaultView: 'month',
            editable: false,
            minTime: '8:30am',
            maxTime: '10:00pm',
            weekends: true,
            eventRender: function (event, element) {
            },
            eventClick: function (calEvent, jsEvent, view) {
            },
            dayClick: function (date, jsEvent, calEvent) {
            }

        })
    });

I am new to using FullCalendar, and I am planning on using JSON to feed it the events but i dont know how to start. I am trying to hard code an event into it just to have an idea of where and how i should be passing it the JSON. Most likely i will create a webservice that has a function that returs the Json format and feed it, but in the meantime. How can i hard code an event. Here is the code I currently have. How and where can I hard code an event below? :

<script type="text/javascript">
    $(document).ready(function () {

        $('#calendar').fullCalendar({
            allDaySlot: false,
            header: {

                left: 'today prev next',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            axisFormat: 'h(:mm)tt',
            timeFormat: { agenda: 'HH:mm{ - HH:mm}' },
            defaultView: 'month',
            editable: false,
            minTime: '8:30am',
            maxTime: '10:00pm',
            weekends: true,
            eventRender: function (event, element) {
            },
            eventClick: function (calEvent, jsEvent, view) {
            },
            dayClick: function (date, jsEvent, calEvent) {
            }

        })
    });

• javascript
• jquery
• asp
• json
• fullcalendar

Share Improve this question Follow edited Oct 14, 2012 at 3:14 A.M.K 16.8k44 gold badges3636 silver badges6464 bronze badges asked Oct 14, 2012 at 0:35 user710502user710502 11.5k3131 gold badges110110 silver badges164164 bronze badges 2

• this is answered here stackoverflow./questions/2489372/… – loQ Commented Oct 14, 2012 at 1:11
• not really i dont understand what that var n = parseInt(this.className.match(/fc\-slot(\d+)/)[1]); is doing.. I just want to simply add a JSON here on my code to simulate an event. – user710502 Commented Oct 14, 2012 at 1:15

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

Please see: http://arshaw./fullcalendar/docs/event_data/events_json_feed/ for documentation on using JSON feeds as data inputs with jQuery FullCalendar.

Demo: http://jsfiddle/SO_AMK/dB2Ps/

I can't actually create a hosted JSON file, but you should be able to feed it the raw JSON output (I have a sample in my demo).

And a more plex one using every available field, you can insert as many non-standard fields as you want: http://jsfiddle/SO_AMK/u8Ksw/

Very easy to find the various source implementations in the API:

Here's link to Events(JSON feed) docs. http://arshaw./fullcalendar/docs/event_data/events_json_feed/

Just provide your url. There is another set of docs if you already have the object in DOM rather than having plugin make an ajax request

Also , if I remember correctly the download package also contains examples.

本文标签： javascriptFull Calendar creating simple eventStack Overflow