jQuery jQuery UI Railsで使えるGem

Rails3.2でGoogle Calendarライクなカレンダーを使う〜fullcalendar-rails

投稿日:2013年1月25日 更新日:

 fullcalendar-rails

2種類あるけど上の方を使った

github.com/bokmann/fullcalendar-rails

github.com/mankind/fullcalendar-rails

ドキュメント

arshaw.com/fullcalendar/docs/usage/

使い方のリンク

jQuery FullCalendar を使用してかっこいいカレンダーを作る方法

Hello fullcalendar

bundle

application.js

application.css

**.js.coffee

どこかのdiv要素にくっつければOK

なにかオプションをいれないとエラー出る

screenshot

オプション

デフォルトビュー

ビューの種類は5種類

arshaw.com/fullcalendar/docs/views/Available_Views/

  • month 月表示
  • basicWeek 簡易な週表示
  • basicDay 簡易な1日表示
  • agendaWeek Googleカレンダーっぽい週表示
  • agendaDay Googleカレンダーっぽい1日表示

例えば次のようにデフォルトビューを設定できる

screenshot

header

例えばこんなかんじでheaderを指定すれば

ビューを切り替えるボタンが表示される

screenshot

日本表記

表記もカスタマイズ可能

 

screenshot

publicなGoogleカレンダーからイベントを取得

公式からgcal.jsをダウンロードしてこんなかんじでフィードのURLを指定すれば

パブリックなイベントを取得できる(日本の祝日)

screenshot

 

backbone.jsでCRUD これをやりたかった

Building a shared calendar with Backbone.js and FullCalendar: A step-by-step tutorial

 

FullCalenderのカスタマイズ

FullCalendar のカスタマイズ

[FullCalendar]たった2行の追加でFullCalendarをiPad対応にするスクリプト

FullCalendarの日本語化やオプションいろいろ 

FullCalendarの導入からカレンダー毎の色指定まで

fullcalendar.jsで予定が重なったときの表示順番を指定する

fullcalendar_engine

github

 

-jQuery, jQuery UI, Railsで使えるGem
-,

執筆者:

関連記事

no image

Rails3.2のアプリにユーザー機能を追加する~Devise

  アプリにユーザー機能を追加するためにdeviseというgemを使った deviseを使えば高機能なユーザー管理機能を簡単につけることができる 参考 Rails3.2+Mongoidでログ …

Railsでデータベーススキーマの変更と関連するモデルのフォーム

  gemを公開しました!詳細は記事の最後に!   新規投稿するフォームのラベルが変数を使っていて見苦しいので自分で好きなラベルを付けられるようにした いまのスキーマはこんな感じな …

WindowsのRubyでExcelを操作~WIN32OLE

By: Môsieur J. version 9.1 – CC BY 2.0 目次1 WIN32OLE2 hello world3 Excelオブジェクトモデル4 絶対パスを取得するメソッ …

市場テクニカル分析ライブラリta-libとruby用のラッパーruby-talibをインストールする

By: Ponzi_Unit – CC BY 2.0 目次1 ta-lib2 talib_ruby ta-lib ta-libは市場のテクニカル分析用のライブラリ集. macであればHom …

no image

Ubuntu ServerのGuardからネットワーク経由でWindowsのブラウザをリロードする~guard-livereload

Ubuntu12.04.1でCoffeeScriptの自動makeとブラウザの自動リロード~guard-coffeescript   Ubuntu ServerのGuardからGrowl f …