在rails简单形式附件中使用bootstrap glyphicon

Question

大家好我使用简单的形式。我有一个包含附件的模型。一切正常，除了我在浏览器中有一个浏览按钮，如下图所示。而不是浏览按钮我想要bootstrap附件glyphicon。我怎么能实现这个目标？我的代码在此图片下方：

<%= simple_form_for Status.new do |f| %>
  <%= f.input :status, as: :text, required: true, autofocus: true %>
  <%= f.input :statachment, as: :file, label: 'Attach here' %>
  <%= f.submit "Post", class: 'btn btn-primary' %>
<% end %>

Answer 1

您可以尝试以下方式

http://markusslima.github.io/bootstrap-filestyle/

只需要添加

<script type="text/javascript" src="js/bootstrap-filestyle.min.js"> </script>

然后

$(":file").filestyle({input: false});

或

 <%= f.input :statachment, as: :file, label: 'Attach here', class: "filestyle", data-input: "false" %>

或使用其他方式

http://www.abeautifulsite.net/whipping-file-inputs-into-shape-with-bootstrap-3/

在视图中

<span class="btn btn-default btn-file">
    Browse <%= f.input :statachment, as: :file, label: 'Attach here' %>
</span>

和css

  .btn-file {
    position: relative;
    overflow: hidden;
}
.btn-file input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    outline: none;
    background: white;
    cursor: inherit;
    display: block;
}