Haml與Rails：將表格列變成鏈接

Question

我正在創建一個haml表，如下所示：

%tbody
  - @records.each do |br|
    %tr
      %td.name
        = br.full_name
      %td.address
        = br.address

我想創建一個從整個tr到另一個頁面的鏈接。 我怎樣才能做到這一點？

Answer 1

因為在<a>標記內嵌套任何塊級元素都是非法的。 我會使用jQuery。

%tr{"data-link" => url_for(:action => 'show', :id => br.id)}
  %td.name
    = br.full_name
  %td.address
    = br.address

然后，在表末尾：

:javascript
  $("tr[data-link]").click(function() {
    window.location = this.data("link")
  })

您還應該包括一個樣式表，該樣式表將鼠標光標更改為指針。

:stylesheet
  #yourtable tr
    cursor: pointer;

Answer 2

您應該能夠將該行作為一個塊傳遞給link_to ：

link_to(url, html_options = {}) do
  #row
end

編輯：

- link_to(url, html_options = {}) do
  %tr
    %td.name
      = br.full_name
    %td.address
      = br.address

按OP編輯：這最終可以工作：

  %tr
    %td.name
      = link_to(br.full_name, html_options = {:action => 'show', :id => br.id})

Answer 3

這是我在Rails 4.0.2中完成的方法。 我的控制器的名稱為order 。

為您的表分配一個ID，以便以后可以通過CSS進行標識； 我使用了id orders 。

對於包含數據單元格的每個表行，將“ data-link”屬性與鏈接的值添加到該行（在我的情況下，它看起來像/orders/1 ，依此類推）。

app/views/orders/index.html.haml

---

%table#orders
  %tr
    %th ...
    .
    .
    .
  - @orders.each do |order|
    %tr{"data-link" => order_path(order)}
      %td= ...
      .
      .
      .

在您的JavaScript文件（或此處顯示的CoffeeScript文件）中，為具有“數據鏈接”屬性的表行創建鏈接，並為其各自的“數據鏈接”值創建鏈接。

app/assets/javascripts/order.js.coffee

---

$ ->
  $("tr[data-link]").click ->
    window.location = @dataset.link

在控制器的樣式表中，將鼠標懸停在行上以指示它們可單擊時，將光標更改為指針。

app/assets/stylesheets/order.css.scss

---

#orders tr[data-link] {
  cursor: pointer;
}