Skip to content

Instantly share code, notes, and snippets.

@nickclyde

nickclyde/file-field.html.haml

Created March 8, 2017 20:31
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nickclyde/d79b4ff032af7070ea0d6f5e9d609030 to your computer and use it in GitHub Desktop.
Save nickclyde/d79b4ff032af7070ea0d6f5e9d609030 to your computer and use it in GitHub Desktop.
Download ZIP
Semantic UI File Upload Button
Raw
file-field.html.haml
.field
.ui.button.fake-file-field
%i.upload.icon
%span.button-text Choose file
.hidden-file-field
= f.file_field :file
Raw
file-field.js
// Turn file input into a button
$('.hidden-file-field').hide();
$('.fake-file-field').click(function(e) {
$("input[type='file']").click();
});
$('.hidden-file-field').change(function() {
$('.button-text').text(
$('input[type=file]').val().split('\\').pop()
);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment