I am trying to create a form using the following view file
<%= form_for :spec do |form| %>
<fieldset>
<legend><%= #title %></legend>
<%= text_field_for form, "first_name" %>
<%= text_field_for form, "last_name" %>
<div class="form_row">
<label for="gender">Gender: </label>
<%= radio_button :spec, :gender, "Male" %> Male
<%= radio_button :spec, :gender, "Female" %> Female
<%= radio_button :spec, :gender, "Other" %> Other
</div>
<div class="form_row">
<label for="birthdate">Birthdate:</label>
<%= date_select :spec, :birthdate,
:start_year => Spec::START_YEAR,
:end_year => Time.now.year,
:include_blank => true,
:order => [:month,:day,:year] %>
</div>
<%= text_field_for form, "occupation" %>
<%= text_field_for form, "city" %>
<%= text_field_for form, "state" %>
<%= text_field_for form, "zip_code", Spec::ZIP_CODE_LENGTH %>
<%= submit_tag "Update", :class => "submit" %>
</fieldset>
<%end%>
And I am using the following helper method
def text_field_for (form, field,
size=HTML_TEXT_FIELD_SIZE,
maxlength=DB_STRING_MAX_LENGTH)
label = content_tag("label","#{field.humanize}:", :for => field)
form_field = form.text_field field, :size => size, :maxlength => maxlength
content_tag("div", "#{label} #{form_field}", :class => "form_row")
end
However, my output gives HTML code for
<label for="first_name">First name:</label> <input id="spec_first_name" maxlength="255" name="spec[first_name]" size="15" type="text" />
<label for="last_name">Last name:</label> <input id="spec_last_name" maxlength="255" name="spec[last_name]" size="15" type="text" />
instead of textfields and labels
Can anyone suggest a solution for this?
Update text_field_for method as below:
def text_field_for (form, field,
size=HTML_TEXT_FIELD_SIZE,
maxlength=DB_STRING_MAX_LENGTH)
label = content_tag("label","#{field.humanize}:", :for => field)
form_field = form.text_field field, :size => size, :maxlength => maxlength
content_tag "div", label + form_field, :class => "form_row"
end
You were treating the label and form_field as String. You shouldn't be interpolating them.
Related
I am new in RoR. I am trying to add css classes on my form. Here is my form:
<%= form_tag :action => 'create' do %>
<p><label for = "name">Name</label>:
<%= text_field 'books', 'name' %></p>
<div class="form-control">
<p><label for = "author">Author</label>:
<%= text_field 'books', 'author'%></p>
</div>
<p><label for = "price">Price</label><br/>
<%= text_area 'books', 'price'%></p>
<%= submit_tag "Create" %>
<% end -%>
That form controls does not accepting class="form-control mb-4 col-10" placeholder="Patient name" like <input type="text" th:field="*{name}" class="form-control mb-4 col-10" placeholder="Patient name">. How can I apply css styling.
You have to put the class behind a comma
<%= text_field 'books' :name, class:"form-control mb-4 col-10", placeholder="Patient name" %>
I want to write a simple form and submit to backend. Here is my form:
<form action="/users" method="post">
<input name="_method" type="hidden" value="put">
<input name="_csrf_token" type="hidden" value="xxx">
<label for="user_name">Name</label>
<input id="user_1_name" name="user[][name]" type="text" value="Stephen">
<label for="user_age">Age</label>
<input id="user_1_age" name="user[][age]" type="number" value="30">
<label for="user_name">Name</label>
<input id="user_2_name" name="user[][name]" type="text" value="Leo">
<label for="user_age">Age</label>
<input id="user_2_age" name="user[][age]" type="number" value="15">
<div>
<button type="submit">Save</button>
</div>
</form>
When submitted to backend, the parameters I received are:
Parameters: %{"_csrf_token" => "xxx", "_method" => "put", "user" => [%{"name" => "Stephen"}, %{"age" => "30"}, %{"name" => "Leo"}, %{"age" => "15"}]}
But I want the parameters to be (one map for each user):
Parameters: %{"_csrf_token" => "xxx", "_method" => "put", "user" => [%{"name" => "Stephen", "age" => "30"}, %{"name" => "Leo", "age" => "15"}]}
Is it possible?
Phoenix.HTML.Form.input_for/4 is what you need for
<%= form_for #changeset, #action, fn f -> %>
<%= hidden_input f, :_csrf_token, value: "xxx" %>
<%= hidden_input f, :_method, value: "put" %>
<%= inputs_for f, :user, fn cf -> %>
<%= label cf, :name %>
<%= text_input cf, :name %>
<%= error_tag cf, :name %>
<%= label cf, :age %>
<%= text_input cf, :age %>
<%= error_tag cf, :age %>
<% end %>
<%= inputs_for f, :user, fn cf -> %>
<%= label cf, :name %>
<%= text_input cf, :name %>
<%= error_tag cf, :name %>
<%= label cf, :age %>
<%= text_input cf, :age %>
<%= error_tag cf, :age %>
<% end %>
<div><%= submit "Save" %></div>
<% end %>
For some reason when executing this code, the radio buttons that get created aren't mutually exclusive in getting picked. How do I make it so that users can only pick 1 radio button? This code is essentially going through a variety of addresses and allowing a user to pick an address for their order.
<div class="select-address select-address-row" style="display:none">
<% #order.user.addresses.each do |address, index| %>
<%= form_for #order, remote: true, :html => { :id => 'address-form-'+address.id.to_s} do |a| %>
<div class="col-xs-4 select-address-col">
<div class="enterprise-buy-address-box address-<%= address.id %>">
<%= address.shipping_name %><br>
<%= address.line_1 %><br>
<%= address.city %>, <%= address.state %> <%= address.zipcode %><br>
<% isDefault = address.shipping_name == #defaultAddress.shipping_name ? true : false %>
<%= a.radio_button :pickedAddress, 'Address', :checked => isDefault %>
<%= label :pickedAddress, '' %>
<div class="submit-address">
<%= button_tag(type: 'submit', class: "btn btn-xs btn-default address-custom-button-select address-"+address.id.to_s+"-button") do %>
select
<% end %>
</div>
</div>
</div>
<%= a.hidden_field :address_id, :value => address.id %>
<% end %>
<script>
$('.address-<%=address.id%>-button').click(function() {
$('.default-address').empty();
var selectedAddress = $('.address-<%=address.id%>').clone();
selectedAddress.find('.submit-address').remove();
$('.default-address').append(selectedAddress);
$('default-address').addClass("enterprise-buy-address-box");
$('.default-address').show();
$('.select-address').toggle();
$('.change-address-link').toggle();
});
</script>
<% end %>
</div>
Your form_for tag is inside of the loop for the addresses. Even if the name attribute is the same for all of your input type="radio" elements, they will not be mutually exclusive across different form elements. Move your form_for tag outside of the loop so that the radio inputs belong to the same form.
See the following snippet for demonstration:
<p>These won't work</p>
<form>
<input type="radio" name="foo">
</form>
<form>
<input type="radio" name="foo">
</form>
<p>These do work</p>
<form>
<input type="radio" name="bar">
<input type="radio" name="bar">
</form>
I have a form and inside the form there is a text_field_tag. It is written as this...
<%= text_field_tag "search", :placeholder => 'Enter search term...' %>
However, when the HTML is generated this returns in the page source...
<input id="search" name="search" type="text" value="{:placeholder=>"Enter search
term..."}" />
Why is it doing this and how do I fix it so that placeholder works?
The second parameter of the text_field_tag is the value. Give it nil to have it empty:
<%= text_field_tag "search", nil, :placeholder => 'Enter search term...' %>
And give it a String to have a default value:
<%= text_field_tag "search", 'Enter search term...' %>
Add an onclick event to empty it with jQuery:
<%= text_field_tag "search", 'Enter search term...', :onclick => 'if($(this).val()=="Enter search term..."){$(this).val("");};' %>
Edit 2016:
Nowadays, most of the browsers now support the HTML 5 placeholder, which allows us to do this in a cleaner way:
<%= text_field_tag 'search', nil, placeholder: 'Enter search term' %>
# which produces the following HTML:
<input type="text" value="" placeholder="Enter search term">
jsFiddle link
I'm using Devise for user registration. It automatically gives me the form for a new session:
<%= form_for(resource_name, resource, :url => session_path(resource_name)) do |f| %>
.
.
.
<% end %>
I have the email and password label and fields like so:
<div class = "field">
<%= f.label :email %><br />
<%= f.text_field :email %>
</div>
<div class = "field">
<%= f.label :password %><br />
<%= f.password_field :password %>
</div>
But I'd like to add a class the the text_field and password_field so that I can style the boxes to make them look better.
<%= f.text_field :email, :class => "whatever" %>
did not work, so I looked in the Rails API and found a text_field method and did this:
<%= text_field(:user, :email, :class => "whatever" ) %>
which leaves out the "f" called in "form_for...do |f|". Even so, I'm pretty sure it worked because when I "View Source", the output ("id" and "name") matches:
<div class = "field">
<label for="user_email">Email</label><br />
<input id="user_email" name="user[email]" size="30" type="text" value="" />
</div>
<div class = "field">
<label for="user_email">Email</label><br />
<input class="whatever" id="user_email" name="user[email]" size="30" type="text" value="" />
</div>
This all seems great that it works and the source looks like it's fine, but I just want to get some confirmation from some more experienced developers to make sure that this definitely works and that there is nothing behind the scenes that is wrong before I make the change and have problems later.
Something else is wrong in your code.
<%= f.text_field :email, :class => "whatever" %>
Does what you want: you don't need to specify the user model, because the form builder (the f) knows which model it's dealing with.
For more info, read the introduction paragraph here: http://api.rubyonrails.org/classes/ActionView/Helpers/FormHelper.html#method-i-text_field