首页 > 解决方案 > Grouped_select:如何在组下显示特定的选择?

问题描述

1. 背景

在预订表格中,我只想显示可用的房间。

在我的 simple_form 中,我通过 grouped_select 使用下拉菜单。因此,用户会看到一个 room_category 并且在属于该 room_category 的(可用)房间下方。

2.问题

我能够显示 room_category 下的所有房间。但我不知道如何在每个 room_category 下显示特定的房间选择。

3. 以前的尝试

nil is not a symbol nor a string

4. 代码

形式


<%= simple_form_for [@hotel, @reservation] do |f|%>

    <div class="row">
      <div class="col col-sm-3">
        <%= f.input :arrival,
        as: :string,
        label:false,
        placeholder: "From",
        wrapper_html: { class: "inline_field_wrapper" },
        input_html:{ id: "start_date"} %>
      </div>
      <div class="col col-sm-3">
        <%= f.input :departure,
        as: :string,
        label:false,
        placeholder: "From",
        wrapper_html: { class: "inline_field_wrapper" },
        input_html:{ id: "end_date"} %>
      </div>
<%= f.input :room_id, collection: @room_categories.order(:name), as: :grouped_select, group_method: :rooms,  label:false %>

        <%= f.button :submit, "Search", class: "create-reservation-btn"%>

    <% end %>

<script>
const checkIn = document.querySelector('#start_date');
const checkOut = document.querySelector('#end_date');
const checkInAndOut = [checkIn, checkOut];

checkInAndOut.forEach((item) => {
  item.addEventListener('change', (event) => {
    checkAvailability();
  })
})

    function checkAvailability(){

      $.ajax({
        url: "<%= rooms_availability_hotel_path(@hotel) %>" ,
        dataType: 'json',
        type: "POST",
        data: `arrival=${start_date.value}&departure=${end_date.value}`,
        success: function(data) {
          console.log(data);
        },
        error: function(response) {
          console.log(response);
        }
      });
    };
  </script>

Hotels_controller

def rooms_availability
  hotel = Hotel.includes(:rooms).find(params[:id])
  arrival = Date.parse room_params[:arrival]
  departure = Date.parse room_params[:departure]
  time_span = arrival..departure
  @unavailable_rooms = Room.joins(:reservations).where(reservations: {hotel: hotel}).where("reservations.arrival <= ? AND ? >= reservations.departure", arrival, departure).distinct
  hotel_cats = hotel.room_categories
  hotel_rooms = Room.where(room_category: hotel_cats)
  @rooms = hotel_rooms - @unavailable_rooms
  authorize @rooms
  respond_to do |format|
    format.js
  end
end

楷模

class Reservation < ApplicationRecord
  belongs_to :hotel
  belongs_to :room
end

class Room < ApplicationRecord
  belongs_to :room_category
  has_many :reservations, dependent: :destroy
  accepts_nested_attributes_for :room_category
end

class Hotel < ApplicationRecord
  has_many :room_categories, dependent: :destroy
  has_many :rooms, through: :room_categories
  has_many :reservations, dependent: :destroy
end

class RoomCategory < ApplicationRecord
  belongs_to :hotel
  has_many :rooms, dependent: :destroy
  accepts_nested_attributes_for :rooms, allow_destroy: true
end

标签: ruby-on-railsactiverecord

解决方案


在文档中:

group_method - The name of a method which, when called on a member of collection, returns an array of child objects representing the <option> tags. It can also be any object that responds to call, such as a proc, that will be called for each member of the collection to retrieve the value.

所以也许 Proc 是一种选择?

<%= f.input :room_id, collection: @room_categories.order(:name), as: :grouped_select, group_method: Proc.new{ |room_category| room_category.scope_or_method_to_get_available_rooms(@arrival, @departure) }, label:false %>

如果您想动态执行此操作,请尝试通过执行js.erbAJAX 效果的视图模板来注入该行


$("input[name*='room_id']").replaceWith("<%= j(f.input :room_id, collection: @room_categories.order(:name), as: :grouped_select, group_method: :rooms,  label:false)%>")

当然写得完全一样,它不会在没有f表单构建器对象的情况下工作,但是你会很容易找到用简单的替换表单构建器方法的方法grouped_collection_select


推荐阅读