Currently, I have a button that needs to trigger the action associated with a file_field in my Rails application. Below is the erb code I am using:
<label for='file-input'>
<span class='btn btn-success' style='max-width: 300px;'>
<img src=<%= image_path('button-upload-white.svg')%>></img> Upload from computer
</span>
</label>
<%= f.file_field :files, multiple: true, name: 'attachment[file]', id: 'file-input'%>
I tried following the guidance provided in this question and applied the corresponding CSS styles:
.file-input > input
{
display: none;
}
.file-input > label{
cursor: pointer;
}
However, it appears that the solution does not produce the desired outcome and results in the following issue:
https://i.sstatic.net/4M8s2.png
I am aiming for the same functionality where the 'choose files' input either remains hidden or somehow becomes linked to the button itself. Any assistance on resolving this matter would be greatly appreciated. Feel free to request more code snippets if necessary, as I may be approaching this problem incorrectly.