I have a simple form which uses jquery-tokeninput as shown in the code below (http://loopj.com/jquery-tokeninput/, https://github.com/loopj/jquery-tokeninput). Can I convert the form to use formtastic and keep the data attribute working? what should I do to replace data: {load: #product.tags} ?
<%= f.text_field :tag_tokens, data: {load: #product.tags} %>
Something like this, using the input_html Hash:
<%= f.input :tag_tokens, input_html: { data: { load: #product.tags } } %>
Related
I'm using simple_form to render my forms and trying to get the following behavior: I want the client to choose from 3 options. In every option he supplies additional field or two.
So I'd like something like this:
Please set your preferences:
o Pay me on a specific day - [input field to get the day]
o Pay me a specific amount of money - [input field for the amount]
o Pay me on a regular basis - [radio buttons to choose between weekly/monthly basis]
I can create the radio buttons as follows, but can't add nested fields under them:
<%= simple_form_for #client, action: 'edit_payment_method' do |f| %>
<%= f.input :payment_type, label: 'Please set your preferences:',
collection: [ ['Pay me on a specific day', :specific_day],
['Pay me a specific amount of money', :specific_money],
['Pay me on a regular basis', :regular_basis]
], as: :radio_buttons %>
<%= f.button :submit, 'Submit' %>
<% end %>
What would be the best way to create the nested text boxes?
As for the fields, I don't need to send them to different controllers (per payment_type), it's fine if I send them all to one method and read the relevant values according to the payment type he chose.
Thanks! Zach
The simple_form collection_radio_buttons is likely what you want. Its options parameter accepts a block which allows you to customize what is rendered with each radio button. Take a look at the example in rdocs here.
Edited:
Here is basically what you need to do in a relatively generic way (hasn't been tested, but I'm running something similar). Put your additional controls in the partial for each radio button:
<% radio_buttons = [
{ :text => 'Pay me on a specific day', :value => :specific_day, :partial => "<textbox_partial_name>", :locals => { :any_locals => :your_partial_needs} },
{ :text => 'Pay me a specific amount of money', :value => :specific_money, :partial => "<textbox_partial_name>", :locals => { :any_locals => :your_partial_needs} },
{ :text => 'Pay me on a regular basis', :value => :regular_basis, :partial => "<radio_partial_name>", :locals => { :any_locals => :your_partial_needs} },
] %>
<%= simple_form_for #client, action: 'edit_payment_method' do |f| %>
<%= f.label t("account.update_payment_method.title") %>
<%= f.collection_radio_buttons :payment_type, (collection.collect do |r| [r[:text], r[:value], r[:partial].nil? ? "" : r[:partial], r[:locals].nil? ? {} : r[:locals]] end), :second, :first do |builder| %>
<%= builder.label{builder.radio_button(:class => 'payment_method_options') + builder.text} %>
<% unless builder.object[2].blank? %>
<%= render :partial => builder.object[2], :locals => builder.object[3] %>
<% end %>
<% end %>
<%= f.button :submit, 'Submit' %>
<% end %>
You can omit :partial for any radio button that doesn't need additional controls, along with :locals if your partial doesn't need it. There are also ways to simplify this code for your situation, but this example illustrates how to add more complex control structures to each radio button if needed.
OK.. I've managed to solve this somehow, not sure that it's the best alternative, but I'm posting it so if someone needs it in the future he at least has something to start with.
I went with creating a "regular" form using simpleform and then using JQuery to move the inner input fields (which were created regularly) next to the radio buttons.
Add JQuery support to your rails app:
add gem "jquery-rails" to your Gemfile
bundle install
rails generate jquery:install
The form I've used (regular simpleform):
Notice the class that is attached to the radio buttons and the ids that are attached to the input fields. I'll use it later to move the elements.
<%= simple_form_for #client, url: 'update_payment_data' do |f| %>
<%= f.input :payment_type, label: t('account.update_payment_method.title'),
input_html: { class: 'payment_method_options' },
collection: [ [t('account.update_payment_method.sum_based.title'), :amount],
[t('account.update_payment_method.days_in_month_based.title'), :days_in_month],
[t('account.update_payment_method.optout.title'), :optput]
], as: :radio_buttons %>
<%= f.input :payment_amount, label: "Payment amount threshold",
input_html: { id: 'payment_amount_box' } %>
<%= f.input :payment_days_in_month, label: "Payment days in month",
input_html: { id: 'payment_days_in_month_box' } %>
<%= f.button :submit, t('account.update_payment_method.update') %>
<% end %>
In the same page - the JQuery code:
<script>
$(document).ready(function() {
var amount_box = $("#payment_amount_box");
var amount_box_parent = amount_box.parent();
amount_box.detach().appendTo($(".payment_method_options:eq(0)").parent());
amount_box_parent.remove();
var dim_box = $("#payment_days_in_month_box");
var dim_box_parent = dim_box.parent();
dim_box.detach().appendTo($(".payment_method_options:eq(2)").parent());
dim_box_parent.remove();
});
</script>
I think it's pretty self-explanatory, it just looks for what is going to be the inner input fields (by id) and moves them into the appropriate place under the span that simpleform creates for each radio button.
I had to play a little bit with the css to make it look how I wanted (display:block for example), but that's more or less it.
Hope it helps.. Zach
I am creating a virtual attribute in my model:
def entities
#entities = Array.new()
#entities.push(self.contact.name)
#entities.push(self.contact.partner.name) if self.contact.partner
#entities.push('Joint') if self.contact.partner
#entities
end
Then in my form I'm trying to use this array from a nested array. I'm using simple form so it looks like this
<%= f.input :ownership, collection: :entities, :include_blank => false, :label => false %>
However this gives me an error:
undefined method `to_a' for :entities:Symbol
If I have created an array, I don't understand why it isn't rendering as an array. What am I missing?
You can't use :entities as the collection:
<%= f.input :ownership, collection: :entities ...%>
That doesn't work. The error indicates that Simple Form is attempting to convert the argument :entities to an array, which is causing an error.
You need to give it an actual collection:
<%= f.input :ownership, collection: #object.entities ... %>
I currently have the following link:
<%= link_to 'New campus', new_campus_path(:university_id => #university.id) %>
and the url I get is:
/campus/new?university_id=1
How can I pass the parameter as POST?
I tried adding method => :post, but no luck there. I appreciate any help. Thanks.
The method parameter of link_to should work - what exactly was wrong with it?
<%= link_to 'New campus', new_campus_path(:university_id => #university.id), method: :post %>
Alternatively, you can try button_to
<%= button_to 'New campus', new_campus_path(:university_id => #university.id), method: :post %>
Edit: in both of these cases, the paremeter will still be added to the query string, but as long as the HTTP verb is correct, this shouldn't make a difference for rails, because access to both is done through the params hash.
If it's really important to not include the parameter, you can create the form yourself and add a hidden field:
<%= form_tag new_campus_path, method: :post %>
<%= hidden_field_tag :university_id, #university.id %>
<%= submit_tag 'New campus' %>
<% end %>
I don't think there's a shortcut for this in rails
Edit 2: As an aside, if I'm guessing correctly, this link is supposed to open a form for creating a new campus with a default university selected. If that's the case, you should really be using GET, because it's just a read action that doesn't cause any side effects.
You can use JQuery. Like this :
$("#my_link").click(function() {
$.ajax({
type: 'POST',
url: '/campus/new?university_id=1'
});
});
You can see the doc here : http://api.jquery.com/click/ and here : http://api.jquery.com/jQuery.post/.
Hi I got a noob question, I want to create the following HTML result:
TEXT<span class="arrow-big"></span>
In the above HTML I want to have text with a span-class to style in an image via css.
When I try the following implementations the result reflects just one part of the needed implementation:
<%= link_to "TEXT", controller_path, :class => "button-big layer" %>
results in:
TEXT
and
<%= link_to(content_tag(:span, "", :class => "arrow-big"), controller_path, :class => "button-big layer") %>
results in:
<span class="arrow-big"></span>
Does anyone know how to accomplish?
You could also nest tags by using alternative syntax for link_to helper
<%= link_to controller_path, :class=> "button-big layer" do %>
Text
<%= content_tag(:span, "", :class => "arrow_big" %>
<% end %>
Simply concatenate your text with the 'span':
<%= link_to(("TEXT" + content_tag(:span, "", :class => "arrow-big")).html_safe,
controller_path,
:class => "button-big layer") %>
You'll need the .html_safe around the concatenation since the + operator will otherwise escape the HTML of the content_tag.
Reading your question I did solve my problem.
Than I propose another way to answer your question.
You could create a helper method to make this kind of link that you need.
It would be something like this
def link_with_text_and_span(href, text, span_options= {}, link_options = {})
span_tag = content_tag(:span, span_options[:content] || '', :class => span_options[:class] || '')
link_to(span_tag, href, :class => link_options[:class] || '')
end
The good about it is that your view will be cleaner.
Then you can just call this helper method in your view
<%= link_with_text_and_span("/controller/action", "TEXT", {class: 'arrow-big'}, class: button-big) %>
PS: This code can be improved for sure, if other users want to, please do it.
Here's another way you could use without the content_tag. Not the cleanest but it works!
<%= link_to '<span class="arrow_big"></span>'.html_safe, controller_path, class: "button-big layer" %>
I am using Rails 3 and found that if I add
:remote => :true, there will be added to the tag the data-remote = true attribute. But I can't find a way to add custom data- attributes to the urlhelper. The followings won't work:
<%= link_to projects_path, :history => "new"%>
<%= link_to projects_path, :data-history => "new"%> #this throws an error
<%= link_to projects_path, :data_history => "new"%>
What I want to generate is:
New Project
anyone?
What about:
<%= link_to 'New Project', new_project_path, 'data-history' => 'new' %>
( http://api.rubyonrails.org/classes/ActionView/Helpers/UrlHelper.html#method-i-link_to )
This is an elegant solution:
<%= link_to "foo", foo_path, data: { foo: "bar" } %>