Rails - fullCalendar not rendering JS code

Question

In short, I am trying to add a calendar to my rails app. I have decided upon fullCalendar ( http://arshaw.com/fullcalendar/ ). My problem is that the JS code is not being rendered. The calendar is not appearing. Firebug, however, shows that the JS files have been called. I tested the files in Dreamweaver and the calendar functions as it should. Any idea why it is not rendering? The Javascript and CSS files are placed in their respective folders under app/assets. Here is my code that deals with fullCalendar. Any help would be greatly appreciated.

app/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require jquery.masonry.min.js
//= require bootstrap
//= require_tree .

app/assets/stylesheets/application.css

*= require_self
*= require_tree .
*/

app/views/layouts/application.html.erb

<head>
    <title>One Month Rails</title>
    <%= stylesheet_link_tag    "application", :media => "all" %>
    <%= javascript_include_tag "application" %>
    <%= csrf_meta_tags %>
    <script>
      $(document).ready(function() {
      /* initialize the external events
      -----------------------------------------------------------------*/
      $('#external-events div.external-event').each(function() {
      // create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/)
      // it doesn't need to have a start or end
      var eventObject = {
      title: $.trim($(this).text()) // use the element's text as the event title
      };
      // store the Event Object in the DOM element so we can get to it later
      $(this).data('eventObject', eventObject);
      // make the event draggable using jQuery UI
      $(this).draggable({
      zIndex: 999,
      revert: true, // will cause the event to go back to its
      revertDuration: 0 // original position after the drag
      });
      });
      /* initialize the calendar
      -----------------------------------------------------------------*/
      $('#calendar').fullCalendar({
      header: {
      left: 'prev,next today',
      center: 'title',
      right: 'month,agendaWeek,agendaDay'
      },
      editable: true,
      droppable: true, // this allows things to be dropped onto the calendar !!!
      drop: function(date, allDay) { // this function is called when something is dropped
      // retrieve the dropped element's stored Event Object
      var originalEventObject = $(this).data('eventObject');
      // we need to copy it, so that multiple events don't have a reference to the same object
      var copiedEventObject = $.extend({}, originalEventObject);
      // assign it the date that was reported
      copiedEventObject.start = date;
      copiedEventObject.allDay = allDay;
      // render the event on the calendar
      // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
      $('#calendar').fullCalendar('renderEvent', copiedEventObject, true);
      // is the "remove after drop" checkbox checked?
      if ($('#drop-remove').is(':checked')) {
      // if so, remove the element from the "Draggable Events" list
      $(this).remove();
      }
      }
      });
      });
    </script>
  </head>

app/views/layouts/page.html.erb

<div id='wrap'>
    <div id='external-events'>
        <h4>Draggable Events</h4>
        <div class='external-event'>My Event 1</div>
        <div class='external-event'>My Event 2</div>
        <div class='external-event'>My Event 3</div>
        <div class='external-event'>My Event 4</div>
        <div class='external-event'>My Event 5</div>
        <p>
            <input type='checkbox' id='drop-remove' /> <label for='drop-remove'>remove after drop</label>
        </p>
    </div>
        <div id='calendar'></div>
        <div style='clear:both'></div>
    </div>

Answer 1

You may want to check out https://github.com/bokmann/fullcalendar-rails . Additionally there is fully functional app here https://github.com/bokmann/rails3_fullcalendar . Download the app and give it a look see.

Rails - fullCalendar not rendering JS code

Question

1 answers

solution1
0 2013-09-23 21:09:05

Rails - fullCalendar not rendering JS code

Question

1 answers

solution1 0 2013-09-23 21:09:05

solution1
0 2013-09-23 21:09:05