I've recently updated one Rails 2.x applications to Rails 3 (3.0.20 at the moment, but the ultimate goal is 3.2.x). I noticed that one remote form stopped working properly. It sends requests and new records are created, but to tell that a full page reload is required.
There is absolutely nothing special in its definition:
form_for(#comment, :remote => true, :html => html_options) do |f|
<%= f.label :username, 'Name/nickname' %>
<div class="text">
<%= f.text_field :username, :maxlength => '60' %>
</div>
<%= f.label :email, 'E-mail' %>
<div class="text">
<%= f.text_field :email, :maxlength => '120' %>
</div>
<%= f.label :content, 'Content' %>
<div class="textinput-longer">
<%= f.text_area :content %>
</div>
<%= f.submit 'Add Comment', :value => 'Add comment' %>
<% end %>
There is also an event bound to the form
$('form#comment').bind({
submit: function() {
// disable inputs and change CSS
},
ajaxComplete: function(event, response, request) {
// insert comment
new Comment(response, this);
}
});
I suppose that some script specific for Rails 2.x might be missing?
try this:
remote_form_for(#comment, :html => html_options) do |f|
or
form_for(#comment,{ :remote => true, :html => html_options}) do |f|
Related
There are over 9000 values in my dataset that users can choose from through a select tag. I am using select2 gem so they can search through the dataset but the time to load after and before i input something in the form is a lot. How do I reduce this? I alrady have minimuminputlength as 2 and that is not working for some reason.
<script>
$(document).ready(function() {
minimumInputLength: 2
$('.js-example-basic-single').select2();
});
</script>
<%= form_for #profile, url: user_profile_path, :html => { :multipart => true } do |f| %>
<%= f.text_field :first_name, placeholder: "First Name", class: 'input-1' %>
<%= f.text_field :last_name, placeholder: "Last Name", class: 'input-1' %>
<%= f.select :city, ['les Escaldes,Andorra,Escaldes-Engordany,3040051', 'Andorra la Vella,Andorra,Andorra la Vella,3041563', 'Umm al Qaywayn,United Arab Emirates,Umm al Qaywayn,290594'...], { :include_blank => 'City' }, :required => true, class: 'js-example-basic-single' %>
<% if current_user.profile %>
<%= f.submit 'Update', class: 'btn btn-default', class: 'bu' %>
<% else %>
<%= f.submit 'Create', class: 'btn btn-default', class: 'bu' %>
<% end %>
<% end %>
Also how I do edit the font and font size of the contents of the sleect 2 select values. Editing the class, 'js-example-basic-single' does not work.
Edit: The suggestion below does not work either for me. Am I doing something wrong?
<script>
$(document).ready(function() {
$('.js-example-basic-single').select2();
});
$('select').select2({
minimumInputLength: 3
});
</script>
<%= form_for #profile, url: user_profile_path, :html => { :multipart => true } do |f| %>
<%= f.text_field :first_name, placeholder: "First Name", class: 'input-1' %>
<%= f.text_field :last_name, placeholder: "Last Name", class: 'input-1' %>
<%= f.file_field :avatar, class: 'input-1'%>
<%= f.select :age, [13, 14, 15,16,17...], { :include_blank => 'Age' }, :required => true, class: 'input-1' %>
<%= f.select :gender, ['Male','Female', 'Other'], { :include_blank => 'Gender' }, :required => true, class: 'input-1' %>
<%= f.select :city, ['les Escaldes,Andorra,Escaldes-Engordany,3040051', 'Andorra la Vella,Andorra,Andorra la Vella,3041563', 'Umm al Qaywayn,United Arab Emirates,Umm al Qaywayn,290594'...],{ :include_blank => 'City' }, :required => true, class: 'js-example-basic-single' %>
<%= f.text_field :collegeemail, placeholder: "College Email (Leave Empty If You Do Not Have One)", class: 'input-1' %>
<% if current_user.profile %>
<%= f.submit 'Update', class: 'btn btn-default', class: 'bu' %>
<% else %>
<%= f.submit 'Create', class: 'btn btn-default', class: 'bu' %>
<% end %>
<% end %>
Seems to me you're putting all of the existing 9000+ cities from your db into the page. That's why it takes so long to open a select (it takes some time for user to download such page + it probably takes long to just open/render such select after the page is loaded).
You have to pass just a few options (cities in your case) on the page initially and fetch the rest using AJAX, see this instruction in the select2 docs.
You will need to implement an API endpoint in your Rails app to be able to fetch cities via AJAX request.
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 created an edit form for profile page which contain First Name, Last Name and Photo
<%= form_tag "/profiles/update", :html => {:multipart => true} do%>
<h4>First Name:</h4>
<%= text_field_tag :first_name, #profile.first_name %>
<h4>Last Name:</h4>
<%= text_field_tag :last_name, #profile.last_name %>
<h4>Photo</h4>
<%= file_field_tag :photo %>
<%= submit_tag "Save changes" %>
<% end %>
and on update action I put
#profile.update_attributes(:first_name => params[:first_name], :last_name => params[:last_name], :photo => params[:photo])
So when I run edit form and select new image for file field then submit I got this Error
Paperclip::AdapterRegistry::NoHandlerError in ProfilesController#update
No handler found for "Pic.jpg"
Any suggestions what's the problem here?
It should be:
<%= form_tag "/products/create", :multipart => true do%>
It will work fine now
I have a simple Rails form that allows for its associated parent to be edited. I would like to allow the user to submit this section of the form using :remote => true so that the user can add a new parent, and then select the parent in an updated select menu elsewhere in the form. As you can see in the code, I added a submit button to the parents' part of the form, and it even knows whether to say "Create" or "Update," but when I submit it the entire page is refreshed, the entire form is submitted for validation and so forth. How can I accomplish what I want in Rails?
Here is the code in question:
<%= form_for #sermon, :html => { :multipart => true } do |f| %>
<div class="field">
<%= f.label :title %><br />
<%= f.text_field :title %>
</div>
<div class="field">
<%= f.label :date %><br />
<%= f.text_field :date %>
</div>
<div class="field">
<%= f.label "Speaker" %><br />
<%= f.select :speaker_id, Speaker.all.collect {|p| [ p.name, p.id ] }, {:include_blank => true} %>
</div>
<% #sermon.build_speaker unless #sermon.speaker %>
<%= f.fields_for :speaker, :remote => true, :html => {:data_type => 'html', :id => 'create_speaker_form'} do |g| %>
<%= g.label :name, "Or, add a new speaker:" %><br />
<%= g.text_field :name %>
<%= g.submit %>
<% end %>
</div>
<div class="actions">
<%= f.submit %>
</div>
<% end %>
probably your question has been answered here How do you submit a rails 3 form without refreshing the page?
if that doesn't help you can try using preventDefault() attaching it to your submit button.
I'm starting to use simple_form for a rails application, and while converting some of my forms, I came across one that has two models that it is working with, sort of an embedded form. Is this possible with simple_form?
<% simple_form_for :topic, :url => forum_topics_path do |t| %>
<%= t.input :name, :label => 'Topic' %></p>
<p>First Post:<br/></p>
Title: <%= text_field :post, :title %> <--- this is where i start having problems
Body: <%= text_area :post, :body %>
<%= t.submit 'Save' %>
Thanks
Use simple_fields_for :
<%= simple_form_for :topic, :url => forum_topics_path do |topic_builder| %>
<%= topic_builder.input :name, :label => 'Topic' %>
<%= topic_builder.simple_fields_for :post do |post_builder| %>
<p>First Post:</p>
<%= post_builder.input :title, :input_html => { :size => 30 } %>
<%= post_builder.input :body, :as => :text, :input_html => { :rows => 20, :cols => 50, :class => 'resizable' } %>
<% end %>
<%= topic_builder.submit 'Save' %>
<% end %>
Notes
Note the = symbol in <%= simple_form_for ... and <%= simple_fields_for (required in Rails 3.x)
Removed "Title:" and "Body:" text. Use the label generated for the inputs and style their location with CSS as needed.
Added example of using input_html
There's another approach that I'm using and it works great. Ryan Bates (RailsCasts) has created a gem to handle this.
See https://github.com/reu/simple_nested_form for the details.