Rails: Wie macht man "Button_to" Knopf auf der gleichen Linie erscheinen (ohne eine Zeilenumbruch)?

Question

Ich habe einen Block-Editor, um einen Benutzer und eine verwandte Aktion anzuzeigen, die für jede Iteration in derselben Zeile angezeigt werden sollen.
Sie können wie folgt visualisieren: -

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

Aber wenn ich eine button_to Methode verwenden, wird der Button auf eine neue Zeile angezeigt zu werden. die ich meinen Code-Schnipsel nicht want.heres: -

<% @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 %> 

Aber mit dem obigen Code der ‚E-Mail‘ und ‚Angebot Angebote‘ in zwei Zeilen erscheinen, aber ich mag, dass sie als Paare angezeigt werden, mit jedes Paar erscheint in einer Zeile.

Ich kann es mit einem 'Link_to' erreichen.
Wenn ich 'link_to' anstelle von 'button_to' verwende, kann ich meine Idee erreichen, aber nicht mit button_to. Warum ist dieser Unterschied zwischen link_to und button_to?
Ich möchte das Angebotsgebot nur als Schaltfläche anzeigen.
Nun, wie Sie die Schaltfläche in die gleiche Zeile wie die "E-Mail" erscheinen.

Bitte lassen Sie mich wissen, wenn die Beschreibung der Frage nicht klar ist. Vielen Dank im Voraus.

Answer 1

Ein button_to generiert ein Formular und ein div um die Schaltfläche. Wenn Sie also die Breite des Containers vor der Schaltfläche nicht einschränken, wird die Schaltfläche um 100% verkleinert.

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

Answer 2

Dies ist nicht mit Schienen zu tun, sondern wie Webbrowser Rendern Formen.

Ein button_to ist nur eine bequeme Möglichkeit, ein Formular mit einem nicht sichtbaren Feld zu erstellen. Wenn Sie das Formular in der gleichen Zeile wie die E-Mail-Adresse haben möchten, müssen Sie es in einen Container einfügen, meist ein div. Setzen Sie das div so, dass es nach links schwebt und einen Überlauf versteckt.

Answer 3

button_to macht auf einen Formular-Tag, so dass ich verändern nur die CSS den Form-Tag, um sicherzustellen, keine neue Linie erstellen.

Um es jedoch nur auf ein bestimmtes Formular-Tag anzuwenden, geben Sie add form_class: "myButton" ein, siehe unten.

In Ihrem something.html.erb

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

Setzen Sie diese in Ihrem application.css

myButton { 
    display: inline; 
}