ActiveScaffoldの使い方

 Rails で ActiveScaffold を使用するときに知っておくと良い事。

基本設定

class Admin::UserController < Admin::AdminController
  active_scaffold :user do |config|
    config.label = 'ユーザ管理' # 一番左上に出る見出しの文字列を設定

    # 各列の名称を設定する。一覧、作成画面などで表示される
    config.columns[:name].label = 'なまえ'
    config.columns[:email].label = 'メールアドレス'

    # 作成画面で表示する列を指定する(全部指定する形式)
    config.create.columns = [:name, :created_at]

    # 一覧画面で表示する列を指定する(取り除く形式)
    config.list.columns.exclude :updated_at

    # 編集画面で表示する列を指定する(追加する形式)
    config.edit.columns << :telephone
  end
end

belongs_to の入力形式をセレクトボックスにしたい

デフォルトだと、belongs_to の入力がその場で入力して変更出来るようなUIになってる。これを、セレクトボックスのみにする方法。例えば、 User belongs_to Company というときは以下のようにする。

active_scaffold :user do |config|
  config.columns[:company].form_ui = :select
  ...
end

公式サイトのQ&Aかなんかに、 ui_type = :select としなさいって書いてあるけど、ActiveScaffold 2.0 から form_ui になったのでこっちを使ってね。っていう警告が出るので注意。

表示をカスタマイズしたい

表示をカスタマイズする方法は何通りかある。

  • 1. モデルにインスタンスメソッドを定義
  • 2. ヘルパメソッドをオーバーライド
1. モデルにインスタンスメソッドを定義

例えば、名前と年齢を同じ表示項目にして 「ちゅう(23歳)」 のような表示にしたい時、モデルにメソッドを追加します。

class User < ActiveRecord::Base
  # なまえ(年齢) という形式で文字列を返す。
  def name_with_age
    "#{self.name}(#{self.email}歳)"
  end
  ...
end

ただ、これを定義しただけでは ActiveScaffold が列を拾ってくれないので設定で追加します。今回は、name_with_age= のメソッドは定義していないので表示系のみで出す形になります。例えば、一覧画面に出すときは以下の様にします。

active_scaffold do |config|
  config.list.columns << :name_with_age
  config.columns[:name_with_age] = 'なまえ(年齢)'
end

全部の操作に追加したいときは、以下の様にすると全部に適用出来ます。

active_scaffold do |config|
  config.columns << :name_with_age
end
2. ヘルパメソッドをオーバーライド

ActiveScaffold が、 #{column_name}_column というヘルパメソッドを作っているようなので、これを自分でオーバーライドしてあげればいいみたい。 例えば、 メールアドレスに mailto: のリンクをつけたいときは以下のようにすればいい。モデル : User, コントローラ : Admin::UserController のとき、オーバーライドを定義するヘルパは Admin::UserHelper になる。メールアドレスは email とする。

class Admin::UserHelper
  # リンク付きメールアドレス
  def email_column(record)
    link_to record.email, "mailto:#{record.email}"
  end
end

record は、Userクラスのインスタンスが入ります。

フォームをカスタマイズしたい

  • 1. ヘルパメソッドをオーバーライド
  • 2. パーシャルでオーバーライド
1. ヘルパメソッドをオーバーライド

各フォームは、 #{column_name}_form_column というヘルパメソッドでオーバーライド出来ます。例えば、User.name の入力フィールドを変更するときは以下の様にすればいけます。:size を 10 にしただけだけど、ちゃんと変わってるのが分かるはず。

module Admin::UserHelper
  def name_form_column(record, input_name)
    text_field :record, :name, :size => 10
  end
end

引数にある input_name には、上記だと record[name] という文字列が入っています。ActiveScaffold が吐き出すHTMLを見ると、Rails の Scaffold 的な user[name] ではなく、 record[name] となっています。なので、上のコードは、下と同義です。

module Admin::UserHelper
  def name_form_column(record, input_name)
    text_field :record, :name, :size => 10, :name => input_name
  end
end

変更したければ変えるっていうことなのかな。

ただ、これで変更してしまうとActiveScaffold デフォルトの CSS を適用してるときはフォームの枠がなくなって残念な気分になるので、例えば text_field ならば次のDOMクラスを足してあげると良いです。'term-input text-input'

結局、こんな感じになる。

def name_form_column(record, input_name)
  text_field :record, :name, :size => 10, :class => 'term-input text-input'
end

統一させるなら、同様の形式のフォームのクラスを firebug などで見て真似すればよいかと。

2. パーシャルでオーバーライド

form の1要素 + label を partial ファイルに書くとオーバーライド出来る。

Admin::UserController に該当する view ファイルが置かれるべきディレクトリ app/views/admin/user/ に、 _#{column_name}_form_column.rhtml という partial ファイルを置けばよい。


<%= text_field :record, :name, :size => 10 %>

上記のようなファイルを作ると、入力フォームのなまえ入力の部分が置き換わる。ただ、上記だと他の部分と DOM 構造が違って CSS が効かなくて残念な表示になる。やはり他と統一するなら真似てある程度コピーコピーで。

あと調べること

nested
関連するレコードをその場で表示,編集出来るような設定を行える。
search
検索系全体的に調べる。
map.resources :user, :active_scaffold => true
今知った。Flex でごにょごにょ

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です