Rails：如何使“button_to”按钮出现在同一行（没有换行符）？

Question

我有一个块迭代器来显示用户和相关操作，以便在每次迭代的同一行上显示。

你可以像这样想象它：

user1  update_attribute_button
user2  update_attribute_button.
...
and so on.

但是如果我使用 button_to 方法，按钮将显示在换行符上。这是我不想要的。

这是我的代码片段：

<% @post.bids.each do |bid| %>
<p>
<%= bid.user.email %>   
<%= button_to "Offer Bid", offer_bid_post_bid_path(@post, bid), :action => "offer_bid">
</p>
<% end %>  

但是使用上面的代码，“电子邮件”和“报价”出现在两行中，但我想将它们成对显示，每一对出现在一行上。

如果我使用“link_to”而不是“button_to”，我可以实现我的想法，但无法使用button_to来实现。为什么 link_to 和 button_to 之间有区别？
我只想将“出价”显示为按钮。
现在，拖动按钮，使“button_to”按钮与“电子邮件”出现在同一行。

如果问题描述不清楚，请告诉我。 预先感谢。

Answer 1

button_to 在按钮周围生成一个表单和一个 div。因此，如果不限制按钮之前容器的宽度，则按下按钮时将占用 100% 的宽度。

<% @post.bids.each do |bid| %>
  

    
<%= bid.user.email %>
    <%= button_to "Offer Bid", offer_bid_post_bid_path(@post, bid), :action => “offer_bid”%>
  

<% end %>

Answer 2

button_to

渲染到表单标签，因此我只是更改了 CSS 以确保表单标签不会创建新行。

但是要将其仅应用于特定的表单标签，请添加

form_class: "myButton"

见下文。

在你的something.html.erb中

<%= button_to "Offer Bid", offer_bid_post_bid_path(@post, bid), :action => "offer_bid", form_class: "myButton">

将其放入您的

application.css

myButton {
    display: inline;
}

Answer 3

这与 Rails 无关，而是与 Web 浏览器的渲染形式有关。

button_to 只是创建具有不可见字段的表单的便捷方法。如果您希望表单与电子邮件地址位于同一行，则需要将其放入容器（通常是 div）中，将 div 设置为向左浮动并隐藏溢出。