19

ボタンに素晴らしいアイコンを使用しようとしていますが、submit_tagに表示できません

 <%= submit_tag icon("search"), class: "btn-primary", style:"width:40px;" %>

出力：

 <input class="btn-primary" name="commit" style="width:40px;" type="submit" value="&lt;i class='icon-search' style='font-size:1em' &gt;&lt;/i&gt;">

ヘルパー：

def icon(name, size=1)
  #icon("camera-retro")
  #<i class="icon-camera-retro"></i> 

  html = "<i class='icon-#{name}' "
  html += "style='font-size:#{size}em' "
  html += "></i>"
  html.html_safe
end

ヘルパーのhtml.html_safe行を削除すると、同じことがわかります。そのようなhtml_safeは機能していません。html = raw（html）も試しましたが、効果はありません。

4

4 に答える 4

19

入力送信タグでは、アイコンを表示する必要があるネストされたHTMLは許可されません。

代わりにボタンを使用してみてください。

<button class='btn btn-primary' style='width:40px;'>
  <%= icon("search") %>
</button>

ボタンタグと入力送信タグの動作にはいくつかの違いがあることに注意してください。たくさんの素晴らしい詳細については、このSOの質問をチェックしてください。個人的には、アプリケーションでボタンタグを使用する際に問題は発生していません。ただし、さまざまなブラウザなどに関するYMMV。

于 2012-08-02T18:12:05.413 に答える
4 
<%= link_to(status, :method=>:delete) do %>
   <i class='icon-trash icon-large'></i>
<% end %>
于 2013-07-18T23:53:10.830 に答える
2

次のように、HTMLコードにアイコンを追加できます。

<i class="icon-search"></i>

ただし、Rails link_toヘルパーにアイコンを配置する場合は、ilink_toヘルパーメソッドを使用します。以下の手順に従ってください。

1）Gemfileのアセットグループにgemを追加します：gem'less-rails-fontawesome'

2）バンドルインストールを実行します：

3）@import'fontawesome';であることを確認してください。app / asset / stylesheetes/bootstrap_and_overrides.css.lessではコメントが外されています。

4）*link_to*ヘルパーメソッドの代わりに*ilink_to*ヘルパーメソッドを使用します。

<%= ilink_to "upload-alt", "Edit", edit_post_path(post), class: 'btn btn-mini' %>

Obs：リンクテキストの前にアイコン名を削除してicon-プレフィックスを付けます

これらの手順はここにあります：https ：//github.com/wbzyl/less-rails-fontawesome

于 2013-02-10T18:54:26.463 に答える
1

html_safe私はあなたがヘルパーから取り除きraw icon("search")、ただの代わりに使う必要があると思いますicon("search")

そしてBaronVonBraunが言うように-ではなく使用buttonするinput[submit]

于 2012-08-02T18:11:04.023 に答える