Friday, August 26, 2016

Using Collection_Check_Boxes to Simplify User Interactions

Collection_check_boxes could be a very useful tool for simplify user interactions. Considering such scenario and table associations:

  • model
  • size
  • color
The model has size and color attributes. We hope to add and edit these three items on the same page in order to reduce complexity of operation.

First, the three models must have associations with each other.

model:
has_and_belongs_to_many :sizes
has_and_belongs_to_many :colors
size:
has_and_belongs_to_many :models
color:
has_and_belongs_to_many :models

Secondly, add collection_check_boxes. 

view/models/_form.html.erb
for “size” attribute
<%= f.collection_check_boxes :size_ids, Size.all, :id, :name do |b| %>
  <div class="collection-check-box">
    <%= b.check_box %>
    <%= b.label %>
    </div>
  <% end %>
for “color” attribute
<%= f.collection_check_boxes :color_ids, Color.all, :id, :name do |b| %>
  <div class="collection-check-box">
    <%= b.check_box %>
    <%= b.label %>
    </div>
  <% end %>
Thus, the “size” and “color” attributes can be added and edited in the same page along with “model”. It simplifies the user operation and make the app more intuitive.

No comments:

Post a Comment