AttributesFor

ActiveView Helper to present formatted ActiveModel attributes with icons.

Installation

Add this line to your application's Gemfile:

gem 'attributes_for'

And then execute:

$ bundle

Or install it yourself as:

$ gem install attributes_for

Run generator to add I18n locales:

$ rails generate attributes_for:install

Preferred icon and CSS framework is Font Awesome Bring Font Awesome into your project by using font-awesome-rails or your preferred method.

Screenshot

Sample Application

Sample application using attributes_for can be found here.

Usage

Present attributes using the API in the example below. It can also generate a standard label value pair given an attribute name using the attribute method. Arbitrary strings can also be presented using the string method.

Here is a complete example using all possible options.

<ul class="list-unstyled">
  <%= attributes_for @company do |b| %>
    <li><%= b.attribute :name, icon: 'building-o' %></li>
    <li><%= b.phone :phone %></li>
    <li><%= b.phone :fax, icon: 'fax' %></li>
    <li><%= b.email :email %></li>
    <li><%= b.email :support_email %></li>
    <li><%= b.url :website, id: :site %></li>
    <li>
      <%= b.attribute(:user, icon: 'user') do %>
        <%= link_to @company.user_name, url_for(@company.user) %>
      <% end %>
    </li>
    <li><%= b.duration :duration %></li>
    <li><%= b.boolean :active %></li>
    <li><%= b.date :due_on %></li>
    <li><%= b.datetime :created_at, format: :long %></li>
    <li>
      <%= b.string "Label" do %>
        Content
      <% end %>
    </li>
  <% end %>
</ul>

Passing :label_html or :value_html to #attribute adds the given options to the label and value wrapper tags.

<ul class="list-unstyled">
  <%= attributes_for @product, defaults: { label_html: { class: 'label' } } do |b|
    <li><%= b.attribute :price, icon: 'money', value_html: { class: 'pull-right' } %></li>
  <% end %>
</ul>

Passing :defaults to attributes_for gives the option to all attributes. This option you can typically use when you want add styling to the label of each attribute.

<ul class="list-unstyled">
  <%= attributes_for @company, defaults: { label_html: { class: 'label' } } do |b| %>
    <li><%= b.attribute :name, icon: 'building-o' %></li>
  <% end %>
</ul>

attributes_for wraps labels and values in span tags by default. Passing :wrappers to attributes_for gives you the option to change the wrapper.

<ul class="list-unstyled">
  <%= attributes_for @company, wrappers: { label: 'strong' } do |b| %>
    <li><%= b.attribute :name, icon: 'building-o' %></li>
  <% end %>
</ul>

Passing :empty to attributes_for overrides the default empty value.

<dl>
  <%= attributes_for @company, wrappers: { label: 'dt', value: 'dd' }, empty: '-' do |b| %>
    <%= b.attribute :fax %>
  <% end %>
</dl>

Options

#attributes_for options:

• :defaults - Use these options on all #attribute calls.
• :wrappers - Change default wrapper tags.

#attribute options:

• :label - Disables label if set to false
• :css - Override element's CSS
• :id - Set element's ID
• :format - Used with date helper to format dates.
• :icon - Name of Font Awesome icon to use.

Development

After checking out the repo, run bin/setup to install dependencies. Then, run rake rspec to run the tests. You can also run bin/console for an interactive prompt that will allow you to experiment.

To install this gem onto your local machine, run bundle exec rake install. To release a new version, update the version number in version.rb, and then run bundle exec rake release, which will create a git tag for the version, push git commits and tags, and push the .gem file to rubygems.org.

Contributing

Bug reports and pull requests are welcome on GitHub at https://github.com/blacktangent/attributes_for. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the Contributor Covenant code of conduct.

License

The gem is available as open source under the terms of the MIT License.