Rails and Simpe Form - translate file upload button - ruby-on-rails

Has anybody found a tip how to translate a simple_form input field to upload files ? I have a pretty simple form like that (in slim):
= simple_form_for(#some_object) do |f|
= f.error_notification
= f.input :text
= f.input :photo, as: :file
= f.button :submit
And the generated HTML always has a button 'Choose a file' with a label on the right 'No file chosen'. Googling gave nothing working, most of them proposing tricks in JS. Any other ideas ?

Apparently, there is no easy way to do this. According to the StackOverflow answer, this is not as Rails issue it's an HTML issue.
The way I solved the issue in Simple Form was by adding a label, and hiding the input field.
<%= simple_form_for(#user) do |f| %>
<%= f.label :photo, "Your label here", class: "btn btn-default" %>
<%= f.input :photo, as: :file, label: false, input_html: { style: "display: none" }%>
<%= f.button :submit %>
<% end %>
When tou click the text in the label it will trigger the upload file, opening the window to select the file.
You can then add extra JavaScript to change the label text by the name of the selected file.

Related

How to change label of simple form input

I Have a code in my project like
<div class="form-inputs">
<%= f.input :twitter %>
</div>
It gives label as Twitter in my website. How it produce label with out giving label parameter. I want to change label to something else like Tweet it.
You can add label in very simple way
<%= f.input :twitter, label: 'Tweet it' %>
Check this simple_form usage
If you want to disable label
<%= f.input :input_field_name, label: false %>
Add custom class to label
<%= f.input :field_name, label_html: { class: 'my_class' } %>

Rails require radio button from a collection

I need a way for my form to not be sent if the user didn't bother to select any radio buttons.
I'd like to to that within the view and the controller, not in the model (the data shouldn't even be sent)
<%= form_tag("/bookings/new", method: "get") do %>
<% #flights.each do |flight| %>
<%= radio_button_tag :flight_id, flight.id %>
<% end %>
<%= submit_tag "book now" %>
<% end %>
edit, to clarify
normally I'd do
<%= f.text_field :name, required: true %>
but, as I have many radio buttons and I only need one for the form to work, I don't know how to implement it
You can set validation in the model to see the presence of checkbox if javascript is disabled. This is a more robust method.
validates :flight_id, :acceptance => true
Docs here - http://guides.rubyonrails.org/active_record_validations.html#acceptance
Edit
function validateCheckBox() {
var x = document.getElementById("flight_id").checked;
if(!x) {alert("Not checked")}
}
<%= submit_tag "book now" , :onclick => "validateCheckBox();" %>
<%= f.text_field :name, required: true %>
This still works perfectly for radio buttons, and it's okay if it ends up on all radio items. The form will still only require one input.
I just tested it on my Rails 6 app.

Rails: Simple Form Custom Label Not Working

I'd like to create a custom label for a simple form field. For some reason, the below code isn't creating that label. It's still using the default label. I must be missing something easy.
Simple Form 3.1
<%= simple_form_for "#" do |f| %>
<%= f.input :street, label: "Custom Label" %>
...
<% end %>
How can I create a custom label for my inputs in Simple Form?
You need to use a label helper along with your input helper:
<%= simple_form_for "#" do |f| %>
<%= f.label :street, 'Custom label' %>
<%= f.input :street, as: :string, label: false %>
<% end %>
You can also directly specify input types ie. f.text_field - More info : http://api.rubyonrails.org/classes/ActionView/Helpers/FormHelper.html
You can now pass a label as argument. So the syntax as shown in the question (from 2015) now works:
<%= f.input :street, label: "Custom Label" %>
See the "Usage" section of the readme.

Displaying file field value on edit

When upload pictures, everything goes okay.
But on edit, it doesn't display the file fields value. Just an empty file_field, like nothing is there. Pic title displays correctly.
Other text is in hungarian.
_form.html.haml
= simple_nested_form_for(#post) do |f|
= f.input :title, label: 'Cím'
= f.input :body, label: "Test"
= f.fields_for :pics do |pic_form|
= pic_form.text_field :title
%br/
= pic_form.file_field :image
= pic_form.link_to_remove "Kép Törlése", class: "btn btn-warning"
%br/
%br/
%p= f.link_to_add "Kép hozzáadása", :pics, class: "btn btn-success"
%br/
%br/
= f.submit "Mentés", class: "btn btn-primary"
= javascript_include_tag :defaults, "nested_form"
How to pass, the existing file to the file_field?
You have to use a conditional to find out if the file(s) is/are attached. Using ActiveStorage, the conditional could look like this (for a field that accepts only one file):
<% if #my_object.my_file.attached? %>
<%= #my_object.my_file.blob.filename %>
<% else %>
<%= f.file_field :my_file %>
<% end %>
If the field accepts many files, you have to iterate to show the filenames:
<% #my_object.my_files.each do |i| %>
<%= i.filename %><br>
<% end %>
I am sure there is a corresponding way to handle this in Carrierwave.
I guess this is the default behavior of the file field. On editing a particular action, the id of the file is stored in the file field rather than its entire value.
In the code, I can see that you have used the field for and therefore, a relationship would have been setup between post and pic. So, on close inspection, you would find that Rails would send in the id of the file to the server when you click on the Submit button which is an indication that there is no need to upload or process the pic. However, if you select some file in the file field, then you can see that it does the actual uploading the file. This processing is well handled by Paperclip gem also.

How do you add text inside a text field in Rails?

I would like to add username inside the username text field in my application (vs having a label next to it) the user would be able to type over this text. I've seen it done in html but I'm confused as to how to do it on my new.html.erb page since im using the form_for tag and the text_field tag.
thanks in advanced!
Use "placeholder".
<%= form_for #user do |f| %>
<%= f.text_field :username, :placeholder => "Username" %>
...
<%= f.submit %>
<% end %>
This will only work for html5 supported browsers by the way, so make sure you have jquery fallback for IE 8, 7 etc.
This is achieved by using the HTML5 placeholder attribute.
In rails, you can simply add the placeholder attribute:
<%= f.text_field :whatever, :placeholder => "text for placeholder..." %>

Resources