Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>  
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
  
  <link rel='stylesheet' href='//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.6.1/fullcalendar.css' />
  <script src="//code.jquery.com/jquery-2.1.4.js"></script>
  <script src="//cdn.jsdelivr.net/momentjs/2.10.6/moment-with-locales.min.js"></script>
  <script src='//cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.6.1/fullcalendar.js'></script>
  
</head>
<body>
  <div id="calendar"></div>
</body>
</html>
 
var eventsArray = [
        {
            title  : 'event1',
            start  : '2016-04-13'
        },
        {
            title  : 'event2',
            start  : '2016-04-15',
            end    : '2016-04-17'
        },
        {
            title  : 'event3',
            start  : '2016-04-09T12:30:00',
            allDay : false // will make the time show
        }
    ];
​
var eventsArrayNew = JSON.parse('[{"start":"2016-04-12T15:30:00","end":"2016-04-12T16:30:00","title":"Calendar 1","allDay":"false","id":"a41380d1fbbaa819"}]');
​
​
$(document).ready(function() {
​
    $('#calendar').fullCalendar({
        //theme: true,
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        defaultDate: moment().format("YYYY-MM-DD"),
        editable: true,
        //events: {
        //    url: 'http://www.json-generator.com/api/json/get/ccUKVDYErS?indent=2',
        //    type: 'GET'
        //}
        events: eventsArrayNew
    });
​
});
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
joumpro
0viewers