SimpleFormCustomInputs
Availables inputs
- Switch/Toggle with Switchery
- Masked inputs
- Money inputs based on locale
- File button
- File drag n drop
- Datepicker
- Datetimepicker
- Timepicker
Installation
Add the following gems to your application's Gemfile:
gem 'simple_form'
gem 'simple_form_custom_inputs'
gem 'bootstrap-sass'
source 'https://rails-assets.org' do
gem 'rails-assets-switchery'
gem 'rails-assets-jquery.maskedinput'
gem 'rails-assets-bootstrap-datepicker'
end
And then execute:
$ bundle install
$ rails generate simple_form:install
Usage
In app/assets/javascripts/application.js, you should add as follows:
//= require ...
//= require switchery
//= require jquery.maskedinput
//= require bootstrap-datepicker
//= require simple_form_custom_inputs
//= require ...
Application.scss
@import "bootstrap-sprockets";
@import "bootstrap";
@import "switchery";
@import "bootstrap-datepicker";
@import "simple_form_custom_inputs";
Basic Example:
<%= simple_form_for :example do |f| %>
<%= f.input :boolean, as: :switch %>
<%= f.input :boolean, as: :switch, input_html: {data: {color: '#FF0', secondary_color: '#0F0', jack_color: '#FFF', jack_secondary_color: '#000', size: 'small'}} %>
<%= f.input :phone, as: :masked, input_html: {data: {pattern: '(99) 99999-9999'}} %>
<%= f.input :time, as: :datepicker %>
<%= f.input :photo, as: :button_file, label: false, class: 'btn btn-info', input_html: {multiple: true, data: {multiple_caption: '{count} files selected'}} %>
<%= f.input :album, as: :drop_file, label: false, input_html: {multiple: true, data: {text: 'Send pictures', preview: false}} %>
<% end %>
I18n on datepicker
You just need to set your locale to the desired language on application.rb, and import the locale on application.js
# application.rb
config.i18n.default_locale = 'pt-BR'
...
//= require bootstrap-datepicker
//= require bootstrap-datepicker/locales/bootstrap-datepicker.pt-BR
...
Sample projects
For an example, take a look at the example
folder in this repository.
Contributing
- Fork it
- Create your feature branch (
git checkout -b my-new-feature
) - Commit your changes (
git commit -am 'Add some feature'
) - Push to the branch (
git push origin my-new-feature
) - Create new Pull Request