how the heck do you make a custom layout for radio buttons insimple_form?
this code generates a vertical list of radio buttons:
%fieldset
= f.input :my_collection, label: false, collection: MY_COLLECTION, as: :radio_buttons
but what i want, is for the radio buttons to be in separate columns. so i've output the literal radio buttons like:
.control-group.radio_buttons.required.my_collection
.controls
.row-fluid
.span3
%label.radio
= f.radio_button :my_collection, 'Foo', class: "radio-buttons required"
Foo
%label.radio
= f.radio_button :my_collection, 'Bar', class: "radio-buttons required"
Bar
.span3
%label.radio
= f.radio_button :my_collection, 'Biz', class: "radio-buttons required"
Biz
%label.radio
= f.radio_button :my_collection, 'Baz', class: "radio-buttons required"
Baz
seems to render OK, but the validations stop working. any ideas?
Check the custom wrappers docs. There are some examples with Boostrap or others frameworks.
For instance, you can add this in an simple_form initializer to create a custom checkbox wrapper:
SimpleForm.setup do |config|
config.wrappers :inline_checkbox, :tag => 'div', :class => 'control-group', :error_class => 'error' do |b|
b.use :html5
b.wrapper :tag => 'div', :class => 'controls' do |ba|
ba.use :label_input, :wrap_with => { :class => 'checkbox inline' }
ba.use :error, :wrap_with => { :tag => 'span', :class => 'help-inline' }
ba.use :hint, :wrap_with => { :tag => 'p', :class => 'help-block' }
end
end
end
then use it like any other input but specifying the custom wrapper (Slim code):
= f.input :remember_me, wrapper: :inline_checkbox
Related
I am working on the Padrino admin screen and would like to show a dropdown list using haml in the edit view. In the List view I would like to show the country name rather than the id number it shows is this possible? I am a very newbie to haml.
I am using countries and states
_form.haml
<code>
- error = #province.errors.include?(:countries_id)
%fieldset.control-group{:class => error ? 'has-error' : ''}
=f.label :countries_id, :class => 'control-label'
.controls
=f.select(:countries_id, :collection => #cntrylist, :fields => [:country_name, :id], :selected => :id, :include_blank => false , :class => :dropdown, :prompt => "Select Province/State")
%span.help-inline=error ? f.error_message_on(:countries_id, :class => 'dropdown-error') : pat(:example)
- error = #province.errors.include?(:province_name)
%fieldset.control-group{:class => error ? 'has-error' : ''}
=f.label :province_name, :class => 'control-label'
.controls
=f.text_field :province_name, :class => 'form-control input-large input-with-feedback'
%span.help-inline=error ? f.error_message_on(:province_name, :class => 'text-error') : pat(:example)
- error = #province.errors.include?(:province_code)
%fieldset.control-group{:class => error ? 'has-error' : ''}
=f.label :province_code, :class => 'control-label'
.controls
=f.text_field :province_code, :class => 'form-control input-large input-with-feedback'
%span.help-inline=error ? f.error_message_on(:province_code, :class => 'text-error') : pat(:example)
.form-actions
=f.submit pat(:save), :class => 'btn btn-primary'
=f.submit pat(:save_and_continue), :class => 'btn btn-info', :name => 'save_and_continue'
=link_to pat(:cancel), url(:provinces, :index), :class => 'btn btn-default'
</code>
This works as expected for new but for edit I would prefer to display the dropdown rather than id which it shows
index.haml
%tbody
-#provinces.each do |province|
%tr.list-row
%td.list-column.list-selectable
=check_box_tag 'province_ids[]', :value => province.id, :class => 'list-selectable-checkbox'
%td.list-column=province.id
%td.list-column=province.countries_id
...
In the td.list column where it shows the countries_id I would like to have this as the country_name.
Thanks
I'm using SimpleForm + Bootstrap. How can I add an attribute to all type="text" inputs with class = span12?
Something that outputs something like this:
<div class="controls"><input autofocus="autofocus" class="string required span12" id="user_first_name" name="user[first_name]" required="required" size="50" type="text" value=""></div>
I tried playing with config.wrappers but this
ba.use :input, :wrap_with => { :class => 'span12' }
doesn't work. It adds to wrapper instead of modifying the input tag. Any thoughts?
SimpleForm.setup do |config|
config.wrappers :bootstrap, :tag => 'div', :class => 'control-group', :error_class => 'error' do |b|
b.use :html5
b.use :placeholder
b.use :label
b.wrapper :tag => 'div', :class => 'controls' do |ba|
ba.use :input
ba.use :error, :wrap_with => { :tag => 'span', :class => 'help-inline' }
ba.use :hint, :wrap_with => { :tag => 'p', :class => 'help-block' }
end
end
config.default_wrapper = :bootstrap
end
You can simply override the simple_form default for string input by adding a string_input.rb class file to your rails load path (i.e. app/inputs/string_input.rb) and include as follow:
class StringInput < SimpleForm::Inputs::StringInput
def input_html_classes
super.push('span12')
end
end
If you need to add more default classes to other types of input, you can check out the various input types provided:
https://github.com/plataformatec/simple_form/tree/master/lib/simple_form/inputs
I had a similar issue and after some research I found out that this is not supported using the wrapper api.
The best you can do is use the :defaults option in each form, instead of adding for every input.
https://github.com/plataformatec/simple_form/issues/754
You can achieve this like this: simple_form_for(#my_instance, defaults: { input_html: { class: 'span12' }})
You can also choose to use a custom formbuilder.
https://github.com/plataformatec/simple_form#custom-form-builder
I am trying to format a form and the text fields respond to some methods, and not others.
I can do things like:
f.input :name, :input_html => { :maxlength => 10 }
f.input :name, :input_html => { :disabled => true }
But if I try to do any of the following, they do not work:
f.input :name, :input_html => { :size => 10 }
f.input :name, :input_html => { :class => 'autogrow' }
f.input :name, :input_html => { :rows => 10, :cols => 10 }
When I try using :size, for instance, the generated html shows that size=10, but is not reflected in the actual form.
These were more or less pulled right from the Formtastic documentation on Github, which the Activeadmin documentation refers to.
I am not sure if your question is solved or not.
However according to Formastic Official WIKI, your code should work:
Customize HTML attributes for any input using the :input_html option.
Typically this is used to disable the input, change the size of a text
field, change the rows in a textarea, or even to add a special class
to an input to attach special behavior like autogrow textareas:
<%= semantic_form_for #post do |f| %>
<%= f.inputs do %>
<%= f.input :title, :input_html => { :size => 10 } %>
<%= f.input :body, :input_html => { :class => 'autogrow', :rows => 10, :cols => 20, :maxlength => 10 } %>
<%= f.input :created_at, :input_html => { :disabled => true } %>
<%= f.input :updated_at, :input_html => { :readonly => true } %>
<% end %>
<%= f.actions %>
<% end %>
https://github.com/justinfrench/formtastic
if your code doesn't work , please check out the error logs, or put more debug info to your erb file, to see if you r rails is running under production mode.
i had the same problem. i wanted a nested form for edit with custom text field size.this worked for me.
form do |f|
f.inputs "Header" do
cf.input :name, :input_html => { :class => 'some_style', :rows => 2, :style => 'width:50%'}
end
f.actions
end
so basically u have to create your own class or just work with the :style.
For nested form u can use this code
form do |f|
f.inputs "Header" do
f.has_many :name,:allow_destroy => true,:new_record => true do |cf|
cf.input :first_name, :input_html => { :class => 'some_style', :rows => 2, :style => 'width:50%'}
end
end
f.actions
end
I have the following form_tag working:
<%= form_tag url_for(:controller => "profiles", :action => "remove_academic", :method => :delete), :id => "remove_major_goal", :remote => true do %>
However, the HTML produced shows that :method => "delete" isn't working. So I found a few answers here on form_tag and tried this:
<%= form_tag url_for({ :controller => "profiles", :action => "remove_academic", :method => "delete" }, { :id => "remove_major_goal", :remote => true }) do %>
However that kicks back an error. What am I doing wrong?
DELETE is not a valid value of the method attribute for a HTML form element. You would probably be better inserting a <input type="hidden" name="method" value="delete" /> inside the form (or use a helper method to do so).
Update:
Try one of these:
form_for url_for(:controller => "", :action => ""), :method => "delete", …
form_for { :controller => "", :action => "" }, { :method => "delete", … }
The second set of braces in the second form maybe unnecessary. Likewise, they might be needed in the first form.
When the user is clicking on a link with the class "edit_resource", the content of a div should be replaced by a partial. Here is my code:
$(".edit_resource").click(function(){
var id = $(this).attr("id")
$('#id' + id + '_show').html("<%= escape_javascript(render :partial => 'form', :locals => {:#resource => resource})%>")
})
The code is working as expected, except that that escape_javascript doesn't work. The new content of the div is the text
<%= escape_javascript(render :partial => 'form', :locals => {:#resource => resource})%>
, and this is also what is shown on the page.
No code is executed, and my partial isn't rendered. I have tried to use <%== instead of <%= without luck.
I have also tried
<%= raw escape_javascript(render :partial => 'form', :locals => {:#resource => resource})%>
I have even tried to replace the partial part of the code with just simple rails code. That didn't help either.
What can I do?
I use Rails 3.0.10, and my javascript_include_tag is like this:
<%= javascript_include_tag 'jquery-1.6.2.min', 'jquery-ui-1.8.16.custom.min', 'application', 'jquery.rails.js'%>
Add .html_safe after the closing bracket of escape_javascript
I have put my js in a js.erb-file, and finally managed to use my variables in the right way.
Here's my code:
$('#id' + '<%= #id %>' + '_show').html('<%= escape_javascript(raw render :partial => 'form', :locals => {:#resource => Resource.find_by_id(#id)}).html_safe %>')
And in the controller:
format.js { #id = params[:id]}
In the view: <%= link_to t('edit'), resources_path(:id => resource.id), :remote => true %>
I don't think you can have :#resource # followed by an symbol :
<%= escape_javascript(render :partial => 'form', :locals => {:#resource => resource})%>
Just take that # out
<%= escape_javascript(render :partial => 'form', :locals => {:resource => resource})%>
and use the variable by calling
resource in your partial