collection_check_boxes에서 여러 열을 표시하는 방법

collection_check_boxes 를 사용할 기회가 있었으므로 비망록으로 남겨두려고 생각합니다.

했던 일

collection_check_boxes에 여러 열 표시

각 언어의 버전·개발 환경

루비 2.4.1

Rails 5.1.4

haml 5.0.3

Bootstrap 4.0.0.beta

전제

다음과 같은 관련이 있습니다.

화면 전환 이미지

그룹 목록 페이지가 있습니다.

「소속 사용자 일람 버튼」을 클릭하면 「소속 유저 일람」으로 천이합니다.

"사용자 추가/제외 버튼"을 클릭하면 "멤버 등록"으로 전환합니다.
※쓰고 있고 여기의 버튼의 표시는 유저보다 멤버 쪽이 적절하다고 생각했습니다만, 수정이 번거롭기 때문에 진행합니다.

회원 등록 주위의 소스 코드

members_controller

def index
  @group = Group.find(params[:group_id])
  @users = User.all
end

index.html.haml

= form_with(model: @group, url: admin_group_members_path, group_id: @group.id, local: true) do |form|

  #第3引数に指定したものが、checkboxのvalue値に、第4引数に指定したものが text値になる。
  = form.collection_check_boxes(:user_ids, @users, :id, :name) do |user|
      = user.label { user.check_box + user.text }

= form.submit class: "btn btn-primary float-right"

collection_check_boxes에서 여러 열 표시

회원등록에 있어서, 유저의 계정명(name) 뿐만이 아니라, 메일 주소(email)도 표시하고 싶을 때는 collection_check_boxes 의 개소를 이하와 같이 변경하면, 메일 주소 표시시킬 수 있습니다.

= form.collection_check_boxes(:user_ids, @users, :id, :name) do |user|
      = user.label do
        = user.object.name
        = user.object.email
        = user.check_box

이것에 Bootstrap을 맞추어 좋은 느낌의 테이블로 하면 다음과 같은 코드가 됩니다.

  = form_with(model: @group, url: admin_group_members_path, group_id: @group.id, local: true) do |form|
    %table#group_list.table.table-striped
      %thead
        %tr
          %th ユーザ名
          %th メールアドレス
          %th 追加/除外
      %tbody
        = form.collection_check_boxes :user_ids, User.all, :id, :name do |user|
          = user.label do
            %tr
              %td= user.object.name
              %td= user.object.email
              %td= user.check_box

수정 후의 이미지입니다.


참고로 했습니다.
collection_check_boxes 메서드의 구조 확인