effective_form_inputs 0.3.1 → 0.4.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 375f1f134953913fed15dd35f4d955efd89e7ae5
-  data.tar.gz: 3ade7ebdc2b7d71eb3542942f5eaff19b291e00c
+  metadata.gz: 0b20db9741d49dbba717dccb759e8b9ae7bdf3b9
+  data.tar.gz: 9bb2c5154ca44a3e38841e3e155062ecc187506a
 SHA512:
-  metadata.gz: c7d17d0ebe6e759bcb8e57184eb9e1480660b1f850b445fa0857e0b38bb0d4e2de8b5b11517160b602b0b13eefc94a91ea7c5bdc5f83dc18132b4970c26b128e
-  data.tar.gz: 988b7000d3fba5e5ef36fb2238ccf22fa1dd3f078d7eb9a17b9031ffdb4015164e1ee730f2d1a10e80d73747998469ebabaddce11e9d20f8152cd51ff299bec4
+  metadata.gz: 495e6b9cc1f4730b3c013bf82d9f41fc20eeceef1c0b6ee7aede0ab030886613b7f42b445b8b8eed2924eadfa262a3573c4f5faeff015db8f46c0357f942b981
+  data.tar.gz: f66163842a292ab829de08dd79c5c428b3e9827f75d5291705602cf16f500e04bd3f05256dedc0e9d5610c34a221365ae4dca830518de12814f471b1a6402fa3

data/README.md

@@ -45,7 +45,7 @@ and add the following to your application.css:
 All of the included form inputs will now be available with no additional installation tasks.
 
 
-## Bootstrap3 DateTimePicker
+## Effective Date Time Picker
 
 This custom form input is based on the following awesome project:
 
@@ -97,7 +97,7 @@ For a full list of options, please refer to:
 http://eonasdan.github.io/bootstrap-datetimepicker/Options/
 
 
-## Bootstrap3 DatePicker
+## Effective Date Picker
 
 This custom form input is based on the following awesome project:
 
@@ -149,7 +149,7 @@ For a full list of options, please refer to:
 http://eonasdan.github.io/bootstrap-datetimepicker/Options/
 
 
-## Static Control
+## Effective Static Control
 
 A bootstrap3 Static control input
 
@@ -180,6 +180,91 @@ and as a SimpleForm input:
 There are no options for this form input
 
 
+
+## Effective Select
+
+This custom form input is based on the following awesome project:
+
+Select2 (https://select2.github.io/)
+
+
+### Installation
+
+If you've already installed the 'All Form Inputs' assets (see above), there are no additional installation steps.
+
+To install this form input individually, add the following to your application.js:
+
+```ruby
+//= require effective_select/input
+```
+
+and add the following to your application.css:
+
+```ruby
+*= require effective_select/input
+```
+
+### Usage
+
+As a Rails Form Helper input:
+
+```ruby
+= form_for @user do |f|
+  = f.effective_select :category, 10.times.map { |x| "Category #{x}"}
+  = f.effective_select :categories, 10.times.map { |x| "Category #{x}"}, :multiple => true
+  = f.effective_select :categories, 10.times.map { |x| "Category #{x}"}, :multiple => true, :tags => true
+```
+
+and as a SimpleForm input:
+
+```ruby
+= simple_form_for @user do |f|
+  = f.input :category, :as => :effective_select, :collection => 10.times.map { |x| "Category #{x}"}
+  = f.input :categories, :as => :effective_select, :collection => 10.times.map { |x| "Category #{x}"}, :multiple => true
+  = f.input :categores, :as => :effective_select, :collection => 10.times.map { |x| "Category #{x}"}, :multiple => true, :tags => true
+```
+
+### Modes
+
+The standard mode is equivelant to `:multiple => false` and is a replacement for the default single select box.
+
+Passing `:multiple => true` will allow multiple selections to be made.
+
+Passing `:multiple => true, :tags => true` will allow multiple selections to be made, and new value options to be created.  This will allow you to select one or more tags and create tags in the same form control.
+
+
+### Options
+
+The default options used to initialize this form input are as follows:
+
+```ruby
+:allowClear => !(options[:multiple])  # Only display the Clear 'x' on a single selection box
+```
+
+### Interesting Available Options
+
+To limit the number of items that can be selected in a multiple select box:
+
+```ruby
+:maximumSelectionLength => 2
+```
+
+To hide the search box:
+
+```ruby
+:minimumResultsForSearch => 'Infinity'
+```
+
+For a full list of options, please refer to:
+
+https://select2.github.io/options.html
+
+
+### AJAX Support
+
+There is currently no support for using AJAX to load remote data.  This feature is supported by the underlying select2 library and will be implemented here at a future point.
+
+
 ## Passing Options to JavaScript
 
 All appropriate options passed to any effective_form_input will be used to initialize the Javascript library

data/app/assets/javascripts/effective_form_inputs.js

@@ -1,2 +1,3 @@
 //= require ./effective_date_time_picker/input
 //= require ./effective_date_picker/input
+//= require ./effective_select/input

data/app/assets/javascripts/effective_select/initialize.js.coffee

@@ -0,0 +1,12 @@
+# https://select2.github.io/examples.html
+
+initialize = ->
+  $('select.effective_select:not(.initialized)').each (i, element) ->
+    element = $(element)
+    options = element.data('input-js-options') || {}
+
+    element.addClass('initialized').select2(options)
+
+$ -> initialize()
+$(document).on 'page:change', -> initialize()
+$(document).on 'cocoon:after-insert', -> initialize()

data/app/assets/javascripts/effective_select/input.js

@@ -0,0 +1,2 @@
+//= require ./select2
+//= require ./initialize