Rails 无法显示完整日历
Rails Full calendar can not shown
我正在尝试实施 Example,但一开始我遇到了麻烦。我在页面上看不到日历。但是,当我从网页下载代码并制作 arrangements 时,它就可以工作了。
所以我所做的是
- 创建演示文件夹(rails新建演示)
- 生成脚手架(railsg脚手架事件title:stringdescription:textstart_time:datetimeend_time:datetime)
- 耙子db:migrate
- 然后我添加了
gem 'fullcalendar-rails'
- 捆绑安装
- 添加了 js 和 css
- 添加了 js 来启动日历
- 将 div 标签放到
index.html.erb
所以我还是看不到日历。
这是 gem 文件;
source 'https://rubygems.org'
gem 'rails', '4.2.1'
gem 'sqlite3'
gem 'sass-rails', '~> 5.0'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.1.0'
gem 'jquery-rails'
gem 'turbolinks'
gem 'jbuilder', '~> 2.0'
gem 'fullcalendar-rails'
gem 'sdoc', '~> 0.4.0', group: :doc
group :development, :test do
gem 'byebug'
gem 'web-console', '~> 2.0'
gem 'spring'
end
这是index.html.erb
<p id="notice"><%= notice %></p>
<h1>Listing Events</h1>
<table>
<thead>
<tr>
<th>Title</th>
<th>Description</th>
<th>Start time</th>
<th>End time</th>
<th colspan="3"></th>
</tr>
</thead>
<tbody>
<% @events.each do |event| %>
<tr>
<td><%= event.title %></td>
<td><%= event.description %></td>
<td><%= event.start_time %></td>
<td><%= event.end_time %></td>
<td><%= link_to 'Show', event %></td>
<td><%= link_to 'Edit', edit_event_path(event) %></td>
<td><%= link_to 'Destroy', event, method: :delete, data: { confirm: 'Are you sure?' } %></td>
</tr>
<% end %>
</tbody>
</table>
<br>
<%= link_to 'New Event', new_event_path %>
<br>
<div id="calendar"></div>
这是index.json.jbuilder文件
json.array!(@events) do |event|
json.extract! event, :id, :title, :description
json.start event.start_time
json.end event.end_time
json.url event_url(event, format: :html)
end
这里是events.js.coffee
# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://coffeescript.org/
#
#
$(document).ready ->
$("#calendar").fullCalendar(
)
这里是应用js和css文件;
// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file.
//
// Read Sprockets README (https://github.com/sstephenson/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require fullcalendar
//= require_tree .
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the top of the
* compiled file, but it's generally better to create a new file per style scope.
*
*= require_self
*= require_tree .
*= require fullcalendar
*/
我不知道这是否相关,但是当我搭建 Event rails 创建 events.coffee 文件夹时,我将其更改为 events.js.coffee,如示例中所示。
加载索引页面时会加载所有 js 和 css 文件,但在页面上看不到任何日历
加载turbolinks页面时,不会触发文档就绪事件。
这是turlolinks events的文档,希望对你有帮助。
我正在尝试实施 Example,但一开始我遇到了麻烦。我在页面上看不到日历。但是,当我从网页下载代码并制作 arrangements 时,它就可以工作了。
所以我所做的是
- 创建演示文件夹(rails新建演示)
- 生成脚手架(railsg脚手架事件title:stringdescription:textstart_time:datetimeend_time:datetime)
- 耙子db:migrate
- 然后我添加了
gem 'fullcalendar-rails'
- 捆绑安装
- 添加了 js 和 css
- 添加了 js 来启动日历
- 将 div 标签放到
index.html.erb
所以我还是看不到日历。
这是 gem 文件;
source 'https://rubygems.org'
gem 'rails', '4.2.1'
gem 'sqlite3'
gem 'sass-rails', '~> 5.0'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.1.0'
gem 'jquery-rails'
gem 'turbolinks'
gem 'jbuilder', '~> 2.0'
gem 'fullcalendar-rails'
gem 'sdoc', '~> 0.4.0', group: :doc
group :development, :test do
gem 'byebug'
gem 'web-console', '~> 2.0'
gem 'spring'
end
这是index.html.erb
<p id="notice"><%= notice %></p>
<h1>Listing Events</h1>
<table>
<thead>
<tr>
<th>Title</th>
<th>Description</th>
<th>Start time</th>
<th>End time</th>
<th colspan="3"></th>
</tr>
</thead>
<tbody>
<% @events.each do |event| %>
<tr>
<td><%= event.title %></td>
<td><%= event.description %></td>
<td><%= event.start_time %></td>
<td><%= event.end_time %></td>
<td><%= link_to 'Show', event %></td>
<td><%= link_to 'Edit', edit_event_path(event) %></td>
<td><%= link_to 'Destroy', event, method: :delete, data: { confirm: 'Are you sure?' } %></td>
</tr>
<% end %>
</tbody>
</table>
<br>
<%= link_to 'New Event', new_event_path %>
<br>
<div id="calendar"></div>
这是index.json.jbuilder文件
json.array!(@events) do |event|
json.extract! event, :id, :title, :description
json.start event.start_time
json.end event.end_time
json.url event_url(event, format: :html)
end
这里是events.js.coffee
# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://coffeescript.org/
#
#
$(document).ready ->
$("#calendar").fullCalendar(
)
这里是应用js和css文件;
// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file.
//
// Read Sprockets README (https://github.com/sstephenson/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require fullcalendar
//= require_tree .
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the top of the
* compiled file, but it's generally better to create a new file per style scope.
*
*= require_self
*= require_tree .
*= require fullcalendar
*/
我不知道这是否相关,但是当我搭建 Event rails 创建 events.coffee 文件夹时,我将其更改为 events.js.coffee,如示例中所示。 加载索引页面时会加载所有 js 和 css 文件,但在页面上看不到任何日历
加载turbolinks页面时,不会触发文档就绪事件。 这是turlolinks events的文档,希望对你有帮助。