Question

我的列有一个名为颜色的模型，其中名称。我有另一个名为 Car 的模型，其列中包含 make ，模型和 color_id 。

在创建新的汽车时，我想要一个列出所有颜色的下拉列表，在底部，有一个＆＃39;其他＆＃39;选项。如果用户选择其他＆＃39;其他＆＃39;如何显示文本字段？选项，以便用户可以输入新颜色？

此外，如果用户选择了“其他”＆＃39;并输入输入＆＃39;黄色＆＃39;，如何输入这个新的颜色数据？

Answer 1

你可以用简单的JQuery来做。

在Controller：

中

class CarsController < ApplicationController
  def new # it is up to you if you used another function
     @colors = Color.all.map{|c| [c.name, c.id]}
     @colors += [['Other', -1]] # as there is no negative ID
  end
end

在“查看”中：

# views/cars/new.html.erb
# the following line to the input 
select_tag :color, options_for_select(@colors) #check documentation of select tag for more usability (like default option...)

现在你需要做的就是添加带有禁用属性的输入文本字段，为该输入文本字段添加id例如id="otherColor"，使用JQuery或JavaScript禁用它，并创建一个新的actionListner在change上选择（通过给select_tag附加的param称为'id'，你将被允许这样做），然后检查他是否使用了另一个选项，允许他输入输入。

如果他选择其他选项而不是“其他”，请不要担心，禁用的输入不会随请求一起发送，所以在您的控制器中，您必须检查他是否发送了params['otherColor']（如果是这种情况），创建新颜色并将其附加到汽车，否则将下拉列表中的所选颜色附加到汽车，希望它有所帮助。

Answer 2

执行此操作的一个好方法是使用datalists

<datalist id='colors'>
  <% Color.all.each do |color| %>
    <option><%= color.name %></option>
  <% end %>
</datalist>

<input class='form-control' list='colors' id='car_color_name' name='car[color_name]' value='<%=@car.color.name%>'>

这为您提供了一个下拉输入框，您可以通过键入首字母来选择任何现有颜色，或者您可以在同一输入框中输入全新颜色。

在cars_controller的创建和更新方法中，您可以执行...

@car.color = Color.find_or_create_by(name: params[:car][:color_name])

不需要javascript！

Rails 5将下拉列表与文本字段组合在一起

2 个答案: