JQuery Datepicker with nested Resources Rails 3.1 - ruby-on-rails-3.1

I try to use the datepicker function in my app wich runs with Rails 3.1. I got it working if I use the following in my application.js file:
$(function(){
$("#exam_deadline").datepicker();
});
Now I have a nested Resource and tried a lot of things to get this working for it as well, but didn´t have any success. With some research I found that a possible solution would be this:
$(function(){
$('.datePicker').datePicker();
});
But if I add the class to my fields, it doesn´t even work for the exam_deadline anymore. I´m not so familiar with Javascript and I hope, someone can tell me, what I´m doing wrong.
This are the snippets from my views and .js:
js:
function remove_fields (link) {
$(link).prev("input[type=hidden]").val("1");
$(link).closest(".fields").hide();
}
function add_fields(link, association, content) {
var new_id = new Date().getTime();
var regexp = new RegExp("new_" + association, "g");
$(link).parent().before(content.replace(regexp, new_id));
}
view :
exam:
<%= semantic_form_for #exam do |f| %>
<%= f.inputs do%>
<%= f.input :deadline, :as => :string,
:start_year => Time.now.year, :label => "Anmeldefrist",
:order =>[:day,:month,:year], :class => 'datePicker'%>
<% end %>
<%= f.semantic_fields_for :examdates do |builder|%>
<%= render "examdate_fields", :f => builder %>
<% end %>
<p>
<%= link_to_add_fields "Termin hinzufügen", f, :examdates %>
</p>
<%end%>
examdate_fields:
<%= f.inputs :class => 'fields' do%>
<%= f.input :date, :label =>"Termin",
:as => :string,
:order =>[:day,:month,:year], :start_year => Time.now.year,
:class=>"datePicker" %>
<%= link_to_remove_fields "Entfernen", f %>
<%end%>
my application.html.erb:
<!DOCTYPE html>
<html>
<head>
<title><%= content_for?(:title) ? yield(:title) : "Untitled" %></title>
<%= stylesheet_link_tag "http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/redmond/jquery-ui.css",
"application", "formtastic.css", "formtastic_changes.css" %>
<%= javascript_include_tag "http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js",
"http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js", "application" %>
<%= csrf_meta_tag %>
<%= yield(:head) %>
</head>
...
Thanks in advance for every little tip!

Just a quick guess. You're using single quotes on your try with a class name.
If that doesn't solve the issue I would try to stick with Ids instead of classnames (I don't know whether datepicker can still reference them properly with class selectors). You would just need another Id for every input and dynamically created javascript (a datepicker for every dynamically created input), instead of a static js file.

Ok, after a lot of trying I got it. I changed the js to:
$(function(){
$(".datePicker").datepicker();
$('#ui-datepicker-div').hide();
$.datepicker._defaults.dateFormat = 'dd M yy'
});
and my view:
<%= f.input :date,
:label =>"Termin",
:as => :string,
:order =>[:day,:month,:year],
:start_year => Time.now.year,
:input_html => {:class =>"datePicker" }%>
Now it works:) I hope it helps others who struggle with the same problem.

Related

Formtastic Creating a form without users

I'm creating a web application with formtastic. I installed the gem and wrote my code like this:
<%= semantic_form_for #index do |form| %>
<%= form.inputs do %>
<%= form.input :name %>
<%= form.input :born_on, :start_year => 1997 %>
<%= form.input :description, :as => :text %>
<%= form.input :female, :as => :radio, :label => "Gender", :collection => [["Male", false], ["Female", true]] %>
<% end %>
<%= form.actions do %>
<%= form.action :submit, :as => :button %>
<% end %>
<% end %>
I want the form to appear on the index page which is why I have #index. For some reason I can't do #index. How would I reference the top line so that it renders a form on the index page? Currently my index page has nothing in it, but it is defined in the controller
form_for helper expects some object that responds to fields You refer inside Your form. Here is an example of using semantic_form_for with plain Ruby object: http://affy.blogspot.com/2010/02/using-formtasic-without-activerecord.html.
Also the object You specify for form doesn't effect which page is being rendered. Are You sure You are not mixing up something? Maybe if You share a bit more of Your controller code we might help You better.

How to pass name of form_for's method to partial in rails?

Good day! Little newbee question:
let's say I want to generate fields of form_for helper of special appearance. Thus to not to repeat complex code to generate many fields of model, I render some partial and pass there parameters. There is a reference to form object amongst them. Question is what pass to render method to call in the partial necessary method of form object? For example I want to generate this time email_field:
<%= form_for #order do |f| %>
<%= render :partial => 'form_field_special', :locals => {:form => f, :type => :email_field, :labelcaption => "SpcName"} %>
<% end %>
and partial itself:
<div class="control-group">
<%= f.label :name, <%= labelcaption %> , :class => "control-label" %>
<div class="controls">
<%= f.type :name %> # ??????
</div>
</div>
thank you guys!
Use ruby power. Object#send method:
<%= form_for #order do |f| %>
<%= render :partial => 'form_field_special', :locals => {..., :field_type => 'email_field'} %>
<% end %>
<%= f.send(field_type, :name) %>
The following method proved as the fastest way to invoke ruby object's function by its name:
m = form.method(name_of_the_method)
m.call(parameters)

prevent double click with disable_form, ruby on rails

I'm trying to prevent a form from being "double posted", when the user either clicks twice or hits submit twice.
I've seen a couple posts on this, but they haven't hit this issue per se. I can't seem to get the below to stop double-posts, and I'm getting the feeling it's related to the remote => true (using ajax to show the content on the page).
Below is my form:
<%= form_for([#posts, #comment], :remote => true) do |f| %>
<%= f.text_field :comment %>
<%= f.submit "Submit", class: "btn btn-large btn-primary", :style => 'display: none;', :disable_with => '' %>
<% end %>
Any recommendations would be great. Thank you!
Use the disable_with option
<%= submit_tag :submit, :id => 'submit_button', :value => "Create!", disable_with: "Creating..." %>
The other answer didn't work for me — I believe it was from the Rails 2 era. According to the docs, the disable_with attribute should be added within a data attribute, like so:
<%= submit_tag "Complete sale", data: { disable_with: "Please wait..." } %>

Paperclip multiple upload & save extra field

Im stuck uploading multiple photos to my model when adding an extra field to the photo model. In the code i hard code "1" value to the hidden_field, but i will change it eventually. The paperclip gem raises a rollback and won't insert the photos in the post. If i erase the "hidden_field" line it will success. Any ideas on how to add extra field to the upload in the view?
<%= form_for #campaign_point_of_sale, :html => {:multipart => true }, :url => "/pos/#{#point_of_sale.id}/post/#{#campaign.id}", :method => :post do |f| %>
<%= f.hidden_field :id %>
<label>Add photo <br />
<%= f.fields_for :campaign_result_point_of_sale_photos do |builder| %>
<% if builder.object.new_record? %>
<%= builder.hidden_field :is_mount_photo, :value => "1" %>
<%= builder.file_field :photo %>
<% end %>
<% end %>
<%= f.submit(:value => "Save") %>
Got it!
Just needed to delete the whole builder with both hidden_field and file_field, so the server would not try to insert a picture without an image file (just with a hidden_field value)
This can be achivied by surrounding both inputs with a div and deleting it (with jquery) at form submit if the file_field value was empty. Pretty cheap but works!

Rails 3 & Ajax date_select onchange => submit

I'd like my date to get saved anytime I change my date via ajax, is this possible? I tried
<%= form_for #dates,:remote => true do |f| %>
<%= f.date_select :booking_date,:onchange => "this.form.submit();" %>
<% end %>
but it does nothing, any good work arounds?
From the rails documentation:
date_select(object_name, method, options = {}, html_options = {})
Because onchange is an html option you need to provide an empty set of options to date_select, otherwise it assumes onchange is a date_select option.
You should change your call to date_select to look like this:
f.date_select :booking_date, {}, :onchange => "this.form.submit();"
Are you including this in your layout:
<%= javascript_include_tag :defaults %>
<%= csrf_meta_tag %>

Resources