어떻게 내 버튼에 대한 사용자 글꼴 멋진 아이콘을 시도 submit_tag

Question

에 글꼴 멋진 아이콘을 포함 할 수 있지만, 나는 그것이 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)을 시도했다.

Answer 1

input[submit]보다 사용하기 중첩 된 HTML을 허용합니다. 아이콘을 표시해야합니다.

대신 버튼을 사용하십시오 :

그것은 버튼 태그 입력의 동작 사이에 약간의 차이를 언급하는 것은 가치가

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

태그를 제출합니다. 훌륭한 세부 사항에 대해서는 this SO question을 확인하십시오. 개인적으로 응용 프로그램에서 버튼 태그를 사용하는 데 문제가 없었습니다. YMMV 등 다른 브라우저와 관련하여.

Answer 2

난 당신이 도우미에서 html_safe 제거해야하고, 단지 icon("search")

대신 raw icon("search")를 사용합니다 생각 BaronVonBraun 말한대로 - 태그하지 않는 제출 button 오히려 입력

Answer 3

당신은 다음과 같이 HTML 코드에 아이콘을 추가 할 수 있습니다

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

그러나 레일 LINK_TO 도우미의 장소 아이콘이 ilink_to 도우미 방법을 사용합니다.

1) Gemfile에 자산 그룹에 보석을 추가합니다 : 보석 '덜 레일 - fontawesome'

2) 번들 설치 실행 : 아래의 단계에 따라

3) 수 물론 @import 'fontawesome';은 app/assets/stylesheetes/bootstrap_and_overrides.css.less에서 주석 처리가 해제됩니다.

4) * link_to * helper 메서드 대신 * ilink_to * helper 메서드를 사용하십시오.

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

것을 제외 : 아이콘 이름을 가진 링크 텍스트가 꺼져 아이콘 - 접두사 제거 앞에

이 지침은 여기에 있습니다 : https://github.com/wbzyl/less-rails-fontawesome

Answer 4

<%= link_to(status, :method=>:delete) do %> 
    <i class='icon-trash icon-large'></i> 
<% end %>