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

OPIT编辑：这最终起作用了：

  %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文件）中，为具有“data-link”属性及其各自“数据链接”值的表行创建链接。

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;
}

带有Rails的Haml：将表列放入链接

3 个答案: