Railsで使えるGem

Rails4とBootstrapをつかった動的なナビゲーションとパンくずリスト〜acts_as_nested_set

投稿日:

Railscast

#162 Tree-Based Navigation (revised)を参考に

acts_as_nested_set

github.com/collectiveidea/awesome_nested_set

Gemfile

scaffold

parent_id,rgt,lftというカラムが最低必要.

migrationファイル

model

_form.html.erb

lft,rgtは内部でつかうので、フォームでは不要.
また、親idのセレクタについては、便利なヘルパーが用意されている.

screenshot

simple_formではこう

情報

チートシート
Awesome nested set cheat sheet
Rails3での入れ子集合モデル(nested set model)

ヘッダーnav

show.html.erb

rootsアイテムはヘッダーメニューに表示する

routes.rbでrootはid=1を指定

サイドメニュー

パーシャルを使って再帰的に木構造のデータを読み込む

_sabmenu_pages.html.erb

パンくずリスト

show.html.erb

できた

screenshot

the sortable tree

github.com/the-teacher/the_sortable_tree
Awesome Nested Set Drag&Drop GUI. Best Render Tree Helper for Awesome Nested Set.

Gemfile

jquery uiが必要

application.js

application.css

routes.rb

extend Model

extend Controller

helperメソッド sortable_tree

できた

screenshot

-Railsで使えるGem
-,

執筆者:

関連記事

Rails4.2でselectを絞込できるselect2を使ってみた〜select2

By: Metropolitan Transportation Authority of the State of New York – CC BY 2.0 目次1 select22 Ge …

no image

Railsで動画を管理する2 動画のサムネイルを作成する~CarrierWave + Flowplayer

  *とりあえず動いているけど、もっとましな方法があるとおもいます 前提 Railsで動画ファイルを管理する~CarrierWave Flowplayer 参考 Rubyでffmpegのラッ …

RubyでTwitter〜twitter & t

By: Pete Simon – CC BY 2.0 目次1 はじめに2 twitter.gemのインストール3 Twitterアプリへの登録4 サンプルから試してみる5 cliでTwit …

RailsにTwitter Bootstrapのフォームを設定する~simple_form

環境 RailsにTwitter Bootstrapを設定する~twitter-bootstrap-rails github.com/plataformatec/simple_form 目次1 Gem …

Rails3でajaxでD&Dでまとめてファイルアップロードをスクラッチで~jQueryFileUpload for Rails

参考 Rails3でajaxでD&Dでまとめてファイルアップロード~jQueryFileUpload for Rails Rails3でajaxでD&Dでまとめてファイルアップロード2 …