How do I specify a custom class on a formtastic 1.2.4 field? - formtastic

I have this custom form builder, and it calls:
basic_input_helper(:text_field, :date, :date_value, options.merge!({:html_options => {:class => "datepicker"}})) if options[:response_class] == "date"
The fourth parameter there are the options (the html options, if I read the code correctly), and I would expect that line to add class="datepicker" to my input field, but instead I get:
<input id="r_3_date_value" name="r[3][date_value]" size="30" type="text" value="2012-07-02" />
No class attribute at all. What am I missing?

You have to use the key :input_html instead of :html_options
basic_input_helper(:text_field, :date, :date_value, options.merge!({:input_html => {:class => "datepicker"}})) if options[:response_class] == "date"
The code gets evaluated like this (source on github), you can see the evaluation for input html on line 647

Related

simple_form radio button (need to add <span> tag inside of <label>

What is the best way to create the following HTML using simple_form_for gem?
<label>
<input name="form-field-radio" type="radio" />
**<span class="lbl"> radio option 2</span>**
</label>
Note that by default when I create a radio buttons using the following statements, the above is not created. How can I add that tag in?
<%= f.input :state, :collection => Project::STATES, :as => :radio_buttons %>
I had a similar need (to embed a <span> within the <label>). It isn't the cleanest solution but it did work and I think with some tweaking it could get you the ability to have your input and span embedded within the label. The following modification results in:
<label>Name:
<span class="hint">this is a hint...</span>
</label>
I added the following as an initializer (using rails 4 and simple_form 3) to override the label_text method:
# initializers/simple_form_custom.rb
module SimpleForm
module Components
module Labels
def label_text
if hint
hint_text = %[<span class="hint">#{hint}</span>]
else
hint_text = ""
end
SimpleForm.label_text.call(raw_label_text, required_label_text, hint_text).strip.html_safe
end
end
end
end
Then in initializers/simple_form.rb I have:
config.label_text = lambda { |label, required, hint| "#{label}: #{required} #{hint}" }

need rails like form_for tag in Rhodes

I was wondering if I can have something like form_for tag instead of the html tag in the edit.erb page in Rhodes. Because I have a Counter model with two attribs which I want to update them seperately based on the button pressed which resides right beside the value. I was able to do it in rails using the <%= form.submit 'up_a' %> & check which button was pressed in update method, like:
def update
#counter = Counter.find(params[:id])
if params[:commit] == 'up_a'
update_attri1 # simple increment method for attrib 1
elsif params[:commit] == 'up_b'
update_attri2 # simple increment method for attrib 2
end
end
and call that method to update that value.
So I want to have more control on what attribs I want to update based
on the clicks in form. Is there anyway I can achieve this in Rhodes?
EDIT :
The general problem seems to be that you want two submit buttons in a single form, each of which should do two slightly different things.
In the case that you only have two different values and one submit button for each, the simplest solution would be simply to make two forms that both call the update def (through their action-attribute), but each with their specific value of the query-parameter (in this case "commit"). These calls would have the following form:
<form method="POST" class="myForm" action="<%=url_for :controller => :Counter, :action => :update, :query => {:commit => 'up_a'}%>">
However, if you only want a single form (possibly also with many other input-values) there are several different ways to do it. In the following you will see a detailed implementation of one way to do it.
In this solution your buttons should NOT be submit buttons, but regular buttons (exactly how they are made with jQuery Mobile).
In order to make this solution work, you will need to use some javascript. You should therefore add the following javascript functions to your application.js and include it in your layout.erb.
function submitForm(formClass){
var activeForm = 'div.ui-page-active '+formClass;
$(activeForm).submit();
}
function callCounterSetUpdateAction(c){
$.get('/app/Counter/setUpdateAction', { commit: c});
}
Now that we have the needed javascript functions in place, lets take a look at edit.erb.
In this example Counter have three different attributes: a, b and c. We will however, only pay attention to a and b to begin with.
The form in your edit.erb file should be similar the implementation below. Notice, that the form actually doesn't have a submit button (as we will see later, the submit is actually made through our javascript function submitForm(formClass)).
<form method="POST" class="myForm" action="<%= url_for :action => :update %>">
<input type="hidden" name="id" value="<%= #counter.object %>"/>
<div data-role="fieldcontain">
<label for="counter[a]" class="fieldLabel">A</label>
<input type="text" id="counter[a]" name="counter[a]" value="<%= #counter.a %>" <%= placeholder( "A" ) %> />
</div>
<div data-role="fieldcontain">
<label for="counter[b]" class="fieldLabel">B</label>
<input type="text" id="counter[b]" name="counter[b]" value="<%= #counter.b %>" <%= placeholder( "B" ) %> />
</div>
<div data-role="fieldcontain">
<label for="counter[c]" class="fieldLabel">C</label>
<input type="text" id="counter[c]" name="counter[c]" value="<%= #counter.c %>" <%= placeholder( "C" ) %> />
</div>
<a data-role="button" data-transition="none" href="javascript:callCounterSetUpdateAction('up_a');">Update A</a>
<a data-role="button" data-transition="none" href="javascript:callCounterSetUpdateAction('up_b');">Update B</a>
</form>
Now that we have defined our view (edit.erb) lets take a look at the definitions we need our controller.
Firsly, as it can be seen from the href attribute on the buttons, what actually happens once we press a button is that it calls a javascript function which in turn calls the following def in the controller:
def setUpdateAction
$pressedButton = #params['commit']
WebView.execute_js("submitForm('.myForm');")
end
The purpose of this def is to store the parameter we sent from our button and then submit the form on the active page. Notice here that we added a class called myForm to the form shown above. You should also notice that we ensure that only the form on the active page is selected by adding 'div.ui-page-active ' to our formClass in the jQuery selection.
Finally, lets take a look at how your update definition should look like:
def update
#counter = Counter.find(#params['id'])
c = #params['counter']
if #counter
if $pressedButton == 'up_a'
# Update value A.
#counter.update_attributes(
{"a" => c['a']}
)
elsif $pressedButton == 'up_b'
# Update value B.
#counter.update_attributes(
{"b" => c['b']}
)
end
end
redirect :action => :index
end
It should be noticed here that we select which attributes to update based upon the $pressedButton variable we assigned through setUpdateAction. As a final comment we could also update multiple attributes as seen below (where we also update the 'c' attribute).
#counter.update_attributes(
{"b" => c['b'],"c" => c['c']}
)

Select helper not showing value of selected option in search form

In my Rails 3 app I use both checkboxes and, in one case, a select helper to submit a search form. I applied some jQuery to the form so if I click a checkbox, the form submits. Same with the select helper. If I click the checkbox, after the page renders the checkbox remains checked as an indicator of the parameters used to get the search result. The problem is that the select helper defaults to "Select" after the search form is submitted. It doesn't maintain the value of the params used to perform the search.
For example, say I have three options: "Select", "Arts", and "Vocational". If Select is the default in my form and I want to search by Arts, clicking "Arts" submits the form, refreshes the page, and the records matching "Arts" are rendered. However the select helper doesn't display "Arts". It defaults back to "Select" when the form is submitted.
I'm using Ransack to do the search, so here are the actions in my Controller where I'm performing the search:
def index
#q = User.search(params[:q])
#users = #q.result(:distinct => true)
end
def search
index
render :index
end
Here's my select helper:
<%= f.select :profile_subject_eq, options_for_select([['Select', ''], ['Arts'], ..., ['Vocational']], :selected => #q) %>
(As you can see I've tried to change the :selected to no avail.)
Finally, here's the jQuery I'm using to submit the form:
$(function(){
$('select').live('change',function() {
$(this).closest('form#index').submit();
});
});
UPDATE: Here is the HTML output of the select helper:
<fieldset>
<select id="q_profile_subject_eq" name="q[profile_subject_eq]">
<option value="nil">Select</option>
<option value="Arts">Arts</option>
...
<option value="Vocational">Vocational</option>
</select>
</fieldset>
Try
options_for_select([['Select', 'nil'], ['Arts'], ..., ['Vocational']], #q)
According to the API doc the second parameter is the selected item itself, not a hash like :selected => ...
If your set on using just select, then you can do it this way.
<%= f.select :profile_subject_eq, [["Arts"], ["Vocational"]], {:include_blank => 'Select', selected: params[:q] ? params[:q].try(:[], :profile_subject_eq) : ""} %>

adding size option to file_field tag in rails

ANSWERED
I actually found the answer while formulating the question but I'm posting it any way since some might find this useful(as said here: https://meta.stackexchange.com/questions/49922/should-i-continue-adding-a-question-if-i-have-found-the-answer-myself)
I'm having trouble adding size to a file field in ROR3. Here was my syntax:
= f.file_field :file, :size => "11"
this doesnt appear but creates an file input field with this:
<input type="file" name="soap_test_zip_file[file]" id="soap_test_zip_file_file">
now I KNOW I made it work before so I looked into some old code and found this:
= file_field_tag :file, :size => 11
which outputs this:
<input type="file" size="11" name="file" id="file">
which gives me the correct size, but the wrong file id and name. So I tried this:
<input type="file" size="11" name="soap_test_file_file" id="soap_test_file_file">
which gives me the RIGHT ID, but the WRONG NAME. Question is how do I reproduce that file_field but with the size?
I looked into this answer by Ryan Bigg btw: Problem showing the 'size' attribute for a 'file_field' using Ruby on Rails 3
and he's saying it's a cross browser thing that they render file fields differently. That is the case, but I would like to render a short file field IF the browser can handle it.
I used:
= file_field_tag :soap_test_zip_file, {:name => 'soap_test_zip_file[file]', :size => 11}
This made me override the name(for the controller) and the size
doesn't seem to work for me..
I thought of another alternative :
jquery ..
$('#user_photo_photo').attr('size', 1);
bingo!!
If you want to not rewrite the name attribute you can do something like this :
keep your form
= f.file_field :file, :size => "11"
add an override for the file_field method
# lib/my_override.rb
module ActionView
module Helpers
module FormHelper
def file_field(object_name, method, options = {})
InstanceTag.new(object_name, method, self, options.delete(:object)).to_input_field_tag("file", options.update({:size => options[:size]}))
end
end
end
end
And load it through an initializer
# config/initializers/load_lib.rb
require 'my_override'

How to redirect from one form to another and passing a value to the second form?

I have a "mini" form on the home page which allows the user to select a car color and press submit.
After doing so, the user is taken to another form where the previously selected car color is used to
pre-populate a field in this other form.
The mini form is this:
<%= form_tag('/cars/new', :method => :get) %>
<%= select "new_car", "color_id", Colors.find(:all, :order => "description asc").
collect {|s| [ s.description, s.id ] }, {:include_blank => 'Select color'} %>
<input type="submit" value="Submit"/>
On pressing submit, this routes to the correct action (/cars/new) but the URL in the address bar is:
http://localhost:3000/cars/new?utf8=✓&new_car[color_id]=12
Where I expected it to be:
http://localhost:3000/cars/new?color_id=12
How to make get the URL to look like the one above?
Another question, how exactly is the form_tag to be used? How do you put a closing </form> tag?
For the block form of form_tag, see:
http://api.rubyonrails.org/classes/ActionView/Helpers/FormTagHelper.html#method-i-form_tag
For the query string issue, there's a similar question here:
removing "utf8=✓" from rails 3 form submissions