I have the following (and working) dynamic menu / dropdown which allows you to select a property type and then a property subtype with a regular rails form:
properties.js.coffee
jQuery ->
prop_sub_types = $('#property_prop_sub_type_id').html()
$('#property_prop_type_id').change ->
prop_type = $('#property_prop_type_id :selected').text()
escaped_prop_type = prop_type.replace(/([ #;&,.+*~\':"!^$[\]()=>|\/#])/g, '\\$1')
options = $(prop_sub_types).filter("optgroup[label='#{escaped_prop_type}']").html()
if options
$('#property_prop_sub_type_id').html(options)
else
$('#property_prop_sub_type_id').empty()
_form.html.erb
<%= form_for(#property) do |f| %>
<div class="field">
<%= f.label :name %><br />
<%= f.text_field :name %>
</div>
<div class="field">
<%= f.label :prop_type_id, 'Property Type' %><br />
<%= f.collection_select :prop_type_id, PropType.order(:name), :id, :name, :prompt => "-- Select Property Type --" %>
</div>
<div class="field">
<%= f.label :prop_sub_type_id, 'Property Subtype' %><br />
<%= f.grouped_collection_select :prop_sub_type_id, PropType.order(:name), :prop_sub_types, :name, :id, :name, :prompt => "-- Select Property Subtype --" %>
</div>
<div class="actions">
<%= f.submit %>
</div>
<% end %>
This works fine. However, I'd like to integrate this into a larger app that is already set up with the simple form gem. I'm also using twitter bootstrap via bootstrap-sass.
The closest I can get in my form is:
<div class="field">
<%= f.association :prop_type, :input_html => { :id => "prop_type_id", :class => "span5" }, :prompt => "-- Select Property Type --" %>
<%= f.association :prop_sub_type, :input_html => { :id => "prop_sub_type_id", :class => "span5" }, :prompt => "-- Select Property Subtype --" %>
</div>
Note: I had to change :prop_type_id to :prop_type to keep the app from throwing errors.
But this is not working - the second drop down won't map to the first. I a doing something wrong in my java/coffeescript? Is there such a thing as 'grouped_association' or something along those lines for the second dropdown?
Is this even doable, or should I convert the entire form back to the standard rails format?
UPDATE
I was able to get it to work but sticking the erb into divs as follows:
<div class="field">
<%= f.collection_select :prop_type_id, PropType.order(:name), :id, :name, :prompt => "-- Select Property Type --" %>
</div>
<div class="field">
<%= f.grouped_collection_select :prop_sub_type_id, PropType.order(:name), :prop_sub_types, :name, :id, :name, :prompt => "-- Select Property Subtype --" %>
</div>
You should have a look at the Group section in the simple_form_for github page. I was working on something similar to what you were doing and found this section. It gave me the direction that I needed to go. Instead of doing f.association which I used on other parts, I ended up using f.input with the :group_select and :group_method
f.input :country_id, collection: #continents, as: :grouped_select, group_method: :countries
from
simple_form_for github pag
Related
I am trying use nested models in my rails application but I have a little issue.
This is my view:
<%= simple_form_for #installation do |f| %>
<div class="field">
<%= f.label :x %><br>
<%= f.input :x %>
</div>
<%= f.simple_fields_for :address do |u| %>
<div class="field">
<%= u.label :street_address %><br>
<%= u.input_field :street_address %>
</div>
<% end %>
<% end %>
When I run, I receive this error <%= u.input_field :street_address %> -> "No input found for varchar", but when I change this peace of code to <%= u.input_field :street_address, :as => :string %> work. Why this happen?
The magic is simple form will automatic detect your data type and automatically pick a input control for it. For instance:
text => text_area
string => text field
boolean => checkbox
As the document described, there is not data type of varchar that simple form can understand autotically, so you need to specify the input type manually!
So you can use as: :string or as: :text to make it work!
I have a form_for select where the options are being defined from within the model. I am trying to get it to display a placeholder option but cannot figure out how to.
The Model:
class Factoid < ActiveRecord::Base
attr_accessible :description, :name, :title
validates_presence_of :description, :name, :title
validates_uniqueness_of :title
NAMES = "Angela", "Geordie", "Jared", "Jennifer", "Kevin", "Matthew", "Oscar", "Owen", "Regina", "Todd", "Vaibhavi", "Zack"
UNRANSACKABLE_ATTRIBUTES = ["id", "updated_at"]
def self.ransackable_attributes auth_object = nil
(column_names - UNRANSACKABLE_ATTRIBUTES) + _ransackers.keys
end
end
The Form:
<%= form_for #factoid, :html => { :class => 'form-horizontal' } do |f| %>
<div class="control-group">
<%= f.label :title, :class => 'control-label' %>
<div class="controls">
<%= f.text_field :title, :class => 'text_field' %>
</div>
</div>
<div class="control-group">
<%= f.label :description, :class => 'control-label' %>
<div class="controls">
<%= f.text_area :description, :class => 'text_area' %>
</div>
</div>
<div class="control-group">
<%= f.label :name, :class => 'control-label' %>
<div class="controls">
<%= f.select :name, :collection => Factoid::NAMES %>
</div>
</div>
<div class="form-actions">
<%= f.submit nil, :class => 'btn btn-primary' %>
<%= link_to t('.cancel', :default => t("helpers.links.cancel")),
factoids_path, :class => 'btn' %>
</div>
<% end %>
The second issue is that the dropdown menu is displaying the word "collection" at the top of it (See screenshot below). How do I get read of that. Ideally I want to have a dropdown menu with a placeholder of "Names" that is also displayed at the top when the dropdown menu is opened.
For your text field try something like:
<%= f.text_field :title, :class => 'text_field', value: 'my_default_value' %>
for your select try:
<%= f.select :name, Factoid::NAMES %>
See the docs for select and the rails guide for typical usage (I think the method I've shown you will not work upon submitting the form, see the guides linked for explanation, I'm not sure though).
I'm fairly new to rails and I'm building my first app. I've searched the web for a correct answer but couldn't find any that worked for my case.
I'm using simple form, with rails 4 and bootstrap 3. I have a :location dropdown on a (#employees) model and I want to populate it with a job_title column from my #positions model. I've used a scaffold to generate my position MVC + job_title:string job_description:string.
How can I populate my :location dropdown (on my employees form) with values from :job_title (from #positions model)? I currently have my code as:
<div class="col-md-6 pad-10">
<% options = options_from_collection_for_select(#positions, 'id', 'job_title') %>
<%= f.select :location, options, :input_html => { class: "form-control" } %>
</div>
But as you know, that doesn't work. Any help is appreciated!
Solution:
<div class="col-md-6 pad-10">
<% options = options_from_collection_for_select(Position.all, 'id', 'job_title') %>
<%= f.select :location, options, :input_html => { class: "form-control" } %>
</div>
I used Position.all instead of #positions.
options_from_collection_for_select needs an Array. Docs
So try using Modelname.all instead of #positions or re-declare #positions with #positions = Modelname.all
Because you are using simple_form, you can render a select box for a collection like this:
<%= f.input :location, collection: #positions, label_method: :job_title, value_method: :id, input_html: { class: "form-control" } %>
This should do it for you if you want the id ofan Position object be written to the location field. If you want the job_title cahnge :id to :job_title.
<div class="col-md-6 pad-10">
<%= f.label :location %><br />
<%= f.collection_select :location, #positions, :id, :job_title %>
</div>
I used Position.all instead of #positions.
<div class="col-md-6 pad-10">
<% options = options_from_collection_for_select(Position.all, 'id', 'job_title') %>
<%= f.select :location, options, :input_html => { class: "form-control" } %>
</div>
I'd like to implement automatic selections of prefectures depending on the country that user choose.
I mean, it shows California, New York, and etc in prefecture select if user choose U.S.
Country model has
id
name
Prefecture model has
id
country_id
prefecture
Now I'm showing these field like this
<% resource.build_user_profile if resource.user_profile.nil? %>
<%= form_for(resource, :as => resource_name, :url => registration_path(resource_name), :html => { :method => :put, :class => 'form-horizontal' }) do |f| %>
<%= devise_error_messages! %>
<%= f.fields_for :user_profile do |profile_form| %>
<label class="control-label"><%= profile_form.label :country_id %></label>
<%= profile_form.collection_select("country_id", Country.find(:all), :id, :name_en) %>
<label class="control-label"><%= profile_form.label :prefecture_id %></label>
<%= profile_form.collection_select("prefecture_id", Prefecture.find(:all), :id, :name) %>
<% end %>
Try to change form like this
<%= f.label :country_id %><br />
<%= f.collection_select :country_id, Country.all, :id, :name_en, include_blank: true %>
<%= f.label :state_id, "State or Province" %><br />
<%= f.grouped_collection_select :prefecture_id, Country.all, :prefectures, :name_en, :id, :name, include_blank: true %>
And paste in proper coffee file (if model is profile than profile.js.coffee) If it's in other model change profile in file name and inside file
jQuery ->
$('#resource_name_user_profile_prefecture_id').parent().hide()
prefectures = $('#resource_name_user_profile_prefecture_id').html()
$('#resource_name_user_profile_country_id').change ->
country = $('#resource_name_user_profile_country_id :selected').text()
escaped_country = country.replace(/([ #;&,.+*~\':"!^$[\]()=>|\/#])/g, '\\$1')
options = $(prefectures).filter("optgroup[label='#{escaped_country}']").html()
if options
$('#resource_name_user_profile_prefecture_id').html(options)
$('#resource_name_user_profile_prefecture_id').parent().show()
else
$('#resource_name_user_profile_prefecture_id').empty()
$('#resource_name_user_profile_prefecture_id').parent().hide()
These are the fields I have in my view, the autocomplete on the partcode brings up a list of partcodes from a partcode table. Depending on what partcode is chosen, i want it to dynamically update the description with the description from the partcode table.
<div class="field">
<%= f.label "partcode" %><br />
<%=f.autocomplete_field :partcode, "/goods_ins/1/autocomplete_partcode_partcode" %>
</div>
<div class="field">
<%= f.label "description" %><br />
<%= f.text_field :description, :autocomplete => :off %>
</div>
This is in my routes:
resources :goods_ins do
get :autocomplete_partcode_partcode, :collection => {:view => :get}
end
And my controller:
autocomplete :partcode, :partcode, :extra_data => [:description]
Use following way,
First give id to your text field as below
<%= f.text_field :description,:autocomplete=>:off, :id_element=>'#part_desc'%>
Now set update_elements property with above element id as below
<%=f.autocomplete_field :partcode, "/goods_ins/1/autocomplete_partcode_partcode",:update_elements=>{:id =>'#part_code', :description=>'#part_desc'} %>