data_as_a_function.html 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <link href='../dist/fullcalendar.css' rel='stylesheet' />
  5. <link href='../dist/fullcalendar.print.css' rel='stylesheet' media='print' />
  6. <script src='../lib/jquery/dist/jquery.js'></script>
  7. <script src='../lib/jquery-ui/ui/jquery-ui.js'></script>
  8. <script src='../lib/moment/moment.js'></script>
  9. <script src='../dist/fullcalendar.js'></script>
  10. <script>
  11. $(document).ready(function() {
  12. $('#calendar').fullCalendar({
  13. year: 2010,
  14. month: 0,
  15. header: {
  16. left: 'prev,next today',
  17. center: 'title',
  18. right: 'month,agendaWeek,basicWeek,agendaDay,basicDay'
  19. },
  20. editable: true,
  21. events: {
  22. url: "many_events_json.txt",
  23. data: function() {
  24. var custom_data = { q: 'custom data value' }; // should see this in Networking
  25. console.log('setting custom_data as part of the eventSource fetch');
  26. return custom_data;
  27. }
  28. }
  29. });
  30. });
  31. </script>
  32. <style>
  33. body {
  34. margin-top: 40px;
  35. text-align: center;
  36. font-size: 13px;
  37. font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
  38. }
  39. #calendar {
  40. width: 900px;
  41. margin: 0 auto;
  42. }
  43. </style>
  44. </head>
  45. <body>
  46. <div id='calendar'></div>
  47. </body>
  48. </html>