28

ボタン ala Wufoo を作成しようとしています (ボタン要素の再発見)

次のようなコードを次のように書きたいと思います。

<%form_tag search_path, :method => :get, :class => 'search' do %>
  <%=text_field_tag :search, params[:search] -%>
  <%=button_tag 'search', :name => nil-%>
<%end%>

次の HTML を生成するには (input[type="submit"] タグの代わりに)

<button type="submit" class="positive">
    <img src="/images/icons/tick.png" alt=""/> 
    Save
</button>

メソッドはすでに存在しますか？または、自分のヘルパーをロールする必要がありますか?

4

3 に答える 3

37

これを実現するには content_tag を使用できます。それはあなたが望むことをするためのよりレールシーな方法です。ただし、生の HTML よりも長いです。

<% content_tag :button :type => :submit, :class => :positive do %>
   <%= image_tag "icons/tick.png"%>
   Save
<% end %>

生産する

<button type="submit" class="positive">
    <img src="/images/icons/tick.png" alt="Tick"/> 
    Save
</button>

ただし、これを出発点として使用すると、独自の堅牢なヘルパーを展開したり、パーシャルに抽象化したりすることに問題はありません。

于 2010-02-12T20:53:30.660 に答える
2

すべてをボタンでラップするのではなく、image_submit_tagヘルパーを使用して画像送信タグを作成できます。

<%
image_submit_tag("login.png")
# => <input src="/images/login.png" type="image" />

image_submit_tag("purchase.png", :disabled => true)
# => <input disabled="disabled" src="/images/purchase.png" type="image" />

image_submit_tag("search.png", :class => 'search-button')
# => <input class="search-button" src="/images/search.png" type="image" />
%>

「保存」テキストを<img>

于 2010-02-12T20:15:26.687 に答える
0

JQuery Cheats Gem https://github.com/plowdawg/jquery_cheatsを使用すると、あなたの見解ではそれはただの

<%= submitimage("/path/to/image.png","Alternate Text") %>

注:代替テキストはオプションです。

于 2011-08-17T21:10:14.560 に答える