Trình đơn thả xuống Ruby on rails <select> menu - cách tạo kiểu hoặc áp dụng lớp học cho các tùy chọn?

Question

Làm cách nào để tạo menu thả xuống màu trong ruby ​​trên thanh ray 3?

tôi biết làm thế nào để làm điều đó trong html, css và javascript như sau nhưng tôi không biết làm thế nào trong Ruby on Rails 3.

Lý tưởng nhất là sử dụng collection_select hoặc collection_options_for_select đối tượng bộ sưu tập khác mà xây dựng <select> 's và <options>' s . Sử dụng những điều này sẽ được ưu tiên để tự vòng lặp thông qua bộ sưu tập và nhổ ra các mảnh và tạo kiểu cho mỗi phần mặc dù điều đó có thể được thực hiện.

Mã một phần của những gì tôi đang cố gắng để nhận được là:

<select> 
<option value="">Highlight</option> 
<option value="#000000" style="background-color: Black;color: #FFFFFF;">Black</option> 
<option value="#808080" style="background-color: Gray;">Gray</option> 
<option value="#A9A9A9" style="background-color: DarkGray;">DarkGray</option> 

Full Code là tại địa chỉ: http://pietschsoft.com/post/2004/09/20/Color-the-background-of-items-in-a-Dropdown-box-in-your-HTML-pages.aspx

Answer 1

Rails Helper options_for_select hoàn toàn cho phép bạn cung cấp thông tin kiểu cho các tùy chọn cá nhân.

Đây là trực tiếp từ tài liệu của options_for_select

options_for_select([ "Denmark", ["USA", {:class=>'bold'}], "Sweden" ], ["USA", "Sweden"]) 

cho

<option value="Denmark">Denmark</option>\n<option value="USA" class="bold" selected="selected">USA</option>\n<option value="Sweden" selected="selected">Sweden</option> 

và

options_for_select([["Dollar", "$", {:class=>"bold"}], ["Kroner", "DKK", {:onclick => "alert('HI');"}]]) 

cho

<option value="$" class="bold">Dollar</option>\n<option value="DKK" onclick="alert('HI');">Kroner</option> 

Và trong trường hợp của bạn nó sẽ là

options_for_select([["Black", {:style => "background-color: Black; color: #ffffff"}], 
        ["Gray", {:style => "background-color: Gray"}], 
        ["DarkGray", {:style => "backgorund-color: DarkGray"}]]) 

Answer 2

Việc xây dựng trong những người giúp đỡ không hỗ trợ nó như xa như tôi biết. Tuy nhiên bạn có thể cuộn của riêng bạn với:

def options_colors(colors) 
    colors.collect do |color, code| 
    "<option value='#{code}' style='background-color:#{code};'>#{color}</option> " 
    end.join 
end 

và sau đó sử dụng nó như sau:

@colors = ["Red" => "#f00", "Blue" => "blue"] 
select_tag("setting[bg_color]", options_colors(@colors))