在Rails條件中更改表格行顏色

我按日期創建多個表格，並且希望我的html表格行根據多種條件是不同的顏色。隨着this question的幫助下，我嘗試了，我轉變觀點如下：在Rails條件中更改表格行顏色

<% (Date.current - 6.months..Date.current + 6.months).each do |date|%> 
    <% if !Shift.where(date: date).blank? %> 
    <% @shifts = LaunchShift.where(date: date).all.order(start_time: :asc, booked: :desc) %> 
    <h2><%= date.strftime('%e %b %Y') %></h2> 

    <div class="table-responsive"> 
    <table class="table table-bordered table-striped"> 
    <thead> 
     <tr> 
     <th>...</th> 
     </tr> 
    </thead> 

    <% @shifts.each_with_index do |shift, index| %> 
     <% if shift.booked? %> 
      <% @booker = Member.find(shift.booked_by) %> 
     <% end %> 
     <tbody> 

     <% if shift.booked? %> <---Trying this for changing colour 
      <tr style="background-color:red"> 
     <% else %> 
      <tr> 
     <% end %> 
     <td><%= shift.start_time.strftime("%H:%M") %></td> 
     <% if shift.booked? %>  
      <td>Booked</td> 
      <td><%= link_to @booker.name, member_path(@booker) %></td> 
     <% else %> 
      <td>Free</td> 
      <td></td> 
     <% end %> 
     [...] 
      </tr> 
     </tbody> 
    <% end %> 
</table> 
    </div> 
<% end %>

但只有部分行標爲預訂的是紅色的，雖然shifts.booked？返回爲True。這種方法的工作方式與我認爲的不同嗎？有沒有更好的方式來做到這一點，不使用JS/JQuery（不知道這些）。有什麼建議？謝謝！

來源

2017-03-03 SKR

你可以嘗試像

.booked{ 
    background-color: red; 
} 

.available{ 
    background-color: grey; 
} 

<tr class="<%= shift.booked? ? 'booked' : 'available' %>"> 
</tr>

如果移位被黃牌警告，然後預訂類應用將提供否則將類應用使用三元運算符。

來源

2017-03-03 10:15:53 ashvin

謝謝你，這是一個更好的辦法。但問題仍然是邏輯在某處出錯。並非所有預訂的班次都是紅色，並非所有可用的班次都是灰色的這可能與創建表的循環內的循環有關嗎？數據正確顯示，但不知何故if語句不總是工作。有任何想法嗎？ – SKR

如果陳述不起作用意味着什麼？ – ashvin

@SKR如果數據顯示正確，那麼如果條件應該是正確的，想法是，如果班次被預訂，那麼紅色將適用，否則灰色將適用於 – ashvin

@ ashvin的解決方案很好，但它會更好地向前邁進一步，並將三元運算符置於輔助方法中，從而保持您的視圖不受邏輯影響。例如

<tr class="<%= booked_class(shift) %>">

創建shift_helper.rb文件中的文件夾助手

module ShiftHelper 
    def booked_class(shift) 
    shift.booked? ? "booked" : "available" 
    end 
end

來源

2017-03-03 10:34:16 margo

是的，這也是在條件基礎上應用課程的更好方法。 – ashvin

在Rails條件中更改表格行顏色

回答

相關問題