dynamic_nested_forms 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 9e5f39dc292991ab5e58896ed58a58508704ad3e331c05e78c86f76672e0c433
+  data.tar.gz: 67135d2f013b252664e3720f50f46be6994665fca98bd5e0a61c060e7ca9d93b
+SHA512:
+  metadata.gz: e458459ac8311cfbe77f2f1e73e2316ecd2d3dc8a1e8cde71f860aa0cb3048ec4039dfe308dfb836778f2c2cbb048814ea2304a01b8120e5a6be0f89adb58ddf
+  data.tar.gz: d283fe9a05b9854f2e58657dd5ac78e6ebccb3a5308f7a81903a845ea0ba63ffcfd59489efe34cefa5c8bbbcc6ffd159a87d2ed8383b47c46a2e65bb408125c3

data/MIT-LICENSE

@@ -0,0 +1,20 @@
+Copyright 2018 Nikolay Lipovtsev
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,251 @@
+# DynamicNestedForms
+
+Dynamic Nested Forms with autocomplete and using jQuery.
+Gem helps to make the simple dynamic control of multiple nested forms in Ruby on Rails application.
+- Search for related objects using [jQuery UI Autocomplete](https://jqueryui.com/autocomplete).
+- Easy to add sub-objects directly to a form to create or update the main object.
+- Full management of the nested form.
+
+![Dynamic Nested Forms screenshot](https://user-images.githubusercontent.com/5441376/39106736-62ec2eae-46c6-11e8-867c-94a8e311f7c2.gif)
+
+## Installation
+
+Dynamic Nested Forms works with Rails 5.0 onwards
+Add this line to your application's Gemfile:
+
+```ruby
+gem "dynamic_nested_forms"
+```
+
+And then execute:
+```bash
+$ bundle install
+```
+
+Or install it yourself as:
+```bash
+$ gem install dynamic_nested_forms
+```
+
+## Usage
+
+### Configuring Assets
+
+Because Dynamic Nested Forms using [jQuery UI Autocomplete](https://jqueryui.com/autocomplete) and internal methods of gem, so add to application.js
+
+app/assets/javascripts/application.js
+```javascript
+//= require jquery
+//= require jquery-ui
+//= require dynamic_nested_forms
+```
+
+If you want to include default styles [jQuery UI Autocomplete](https://jqueryui.com/autocomplete), add in application.css
+
+app/assets/stylesheets/application.css
+```css
+*= require jquery-ui
+```
+
+### Configuring Models
+
+Create related models using standard methods Rails
+
+app/models/patient.rb
+```ruby
+class Patient < ApplicationRecord
+  has_many :appointments
+  has_many :physicians, through: :appointments
+  accepts_nested_attributes_for :appointments, allow_destroy: true
+  accepts_nested_attributes_for :physicians
+end
+```
+
+app/models/physician.rb
+```ruby
+class Physician < ApplicationRecord
+  has_many :appointments
+  has_many :patients, through: :appointments
+end
+```
+
+app/models/appointment.rb
+```ruby
+class Appointment < ApplicationRecord
+  belongs_to :patient
+  belongs_to :physician
+end
+```
+
+### Configuring Controllers
+
+Create contrller for main model and additional controller relationship model
+
+app/controllers/patients_controller.rb
+```ruby
+class PatientsController < ApplicationController
+  ...
+  # GET /patients/new
+  def new
+    @patient = Patient.new
+  end
+
+  # GET /patients/1/edit
+  def edit
+  end
+
+  # POST /patients
+  def create
+    @patient = Patient.new(patient_params)
+
+    if @patient.save
+      redirect_to @patient, notice: 'Patient was successfully created.'
+    else
+      render :new
+    end
+  end
+
+  # PATCH/PUT /patients/1
+  def update
+    if @patient.update(patient_params)
+      redirect_to @patient, notice: 'Patient was successfully updated.'
+    else
+      render :edit
+    end
+  end
+  ...
+end
+```
+
+In additional controller add index action. This will generate collections with searched objects.
+- `params[:term]` - Param with insert chars to autocomplete_to_add_item in view.
+- `params[:added_obj]` - Optional. This param help you to save only unique nested objects.
+
+app/controllers/appointments_controller.rb
+```ruby
+class AppointmentsController < ApplicationController
+  def index
+    @appointments = Physician.where("name LIKE ?", "%#{params[:term]}%")
+    render json: @appointments.map { |u| { value: u.id, label: u.name, content: u.name }}
+  end
+end
+```
+
+### Strong Parameters
+
+Don't forget to include the attributes of the associated model into the controller of the main model.
+
+app/controllers/patients_controller.rb
+```ruby
+class PatientsController < ApplicationController
+  ...
+  def patient_params
+    params.require(:patient).permit(:name, appointments_attributes: [:id, :patient_id, :physician_id, :_destroy])
+  end
+  ...
+end
+```
+
+### Configuring Routes
+
+All three controller Teams, Users, and TeamUsers should be included in the file routes.rb
+
+config/routes.rb
+```ruby
+Rails.application.routes.draw do
+  
+  resources :patients
+  resources :physicians
+end
+```
+
+### Configuring Views
+
+Add helper `autocomplete_to_add_item` to enable the search for objects of the associated model and add them as nested form in a main form
+
+```ruby
+autocomplete_to_add_item(name, f, association, source, options = {})
+```
+
+source - The URL the value from search_to_add_fields to be searched.
+
+app/views/patients/_form.html.erb
+```erb
+<%= form_with(model: patient, local: true) do |form| %>
+  <div class="field nested-container">
+    <%= form.label "Appointments" %>
+    <%= autocomplete_to_add_item "autocomplete_appointment", form, :appointments, appointments_index_path %>
+    <div class="nested-items">
+      <%= form.fields_for :appointments, @appointments do |appointment_f| %>
+        <%= render "appointment_item", f: appointment_f %>
+      <% end %>
+    </div>
+  </div>
+<% end %>
+```
+
+app/views/patients/_appointment_item.html.erb
+```erb
+<div class="nested-item">
+  <div class="nested-content">
+    <% if f.object.physician %>
+      <%= f.object.physician.name %>
+    <% end %>
+  </div>
+  <%= f.hidden_field :physician_id, class: "nested-value" %>
+  <%= f.hidden_field :_destroy %>
+  <%= link_to_remove_item %>
+</div>
+```
+
+### Sylize
+
+You can add you class to autocomplete form
+
+app/views/patients/_form.html.erb
+```erb
+<%= autocomplete_to_add_item "autocomplete_appointment", form, :appointments, appointments_index_path, class: "my-class" %>
+```
+
+... or to link_to_remove_item
+
+app/views/patients/_appointment_item.html.erb
+```erb
+<%= link_to_remove_item "Remove", class: "my-class" %>
+```
+
+Rename default link_to_remove_item
+
+app/views/patients/_appointment_item.html.erb
+```erb
+<%= link_to_remove_item "Delete appointment" %>
+```
+
+... or add icon or special char to link_to_remove_item
+
+app/views/patients/_appointment_item.html.erb
+```erb
+<%= link_to_remove_item "&times;".html_safe %>
+```
+
+### If you need only unique objects
+
+In additional controller add option `params[:added_obj]`. This will generate collections with searched unique objects.
+
+app/controllers/appointments_controller.rb
+```ruby
+class AppointmentsController < ApplicationController
+  def index
+    @appointments = Physician.where("name LIKE ?", "%#{params[:term]}%").where.not(id: params[:added_obj])
+    render json: @appointments.map { |u| { value: u.id, label: u.name, content: u.name }}
+  end
+end
+```
+
+## Contributing
+
+[Fork the project](https://help.github.com/articles/fork-a-repo/) and send a [pull request](https://help.github.com/articles/about-pull-requests/) or add an [Issue on GitHub](https://github.com/reformgroup/dynamic_nested_forms/issues)
+
+## License
+
+The gem is available as open source under the terms of the [MIT License](http://opensource.org/licenses/MIT).

data/Rakefile

@@ -0,0 +1,23 @@
+begin
+  require 'bundler/setup'
+rescue LoadError
+  puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
+end
+
+require 'rdoc/task'
+
+RDoc::Task.new(:rdoc) do |rdoc|
+  rdoc.rdoc_dir = 'rdoc'
+  rdoc.title    = 'DynamicNestedForms'
+  rdoc.options << '--line-numbers'
+  rdoc.rdoc_files.include('README.md')
+  rdoc.rdoc_files.include('lib/**/*.rb')
+end
+
+
+
+
+
+
+require 'bundler/gem_tasks'
+

data/app/assets/javascripts/dynamic_nested_forms.js

@@ -0,0 +1,65 @@
+(function($){
+  var createNewId, elCounter;
+  elCounter = 0;
+  
+  createNewId = function() {
+    return new Date().getTime() + elCounter++;
+  };
+	
+  $(document).on('click', '.remove-item', function(e) {
+		e.preventDefault();
+    $(this).prev('input[type=hidden]').val('1');
+    $(this).closest('.nested-item').hide();
+  });
+	
+  $(function() {
+	  $('.autocomplete').each(function() {
+			var $this 			= $(this),
+			nestedContainer = $this.parents('.nested-container');
+      
+			$this.autocomplete({
+				source: function(request, response) {
+					var addedObj = [];
+          
+          // Insert added objects to array
+					nestedContainer.find('.nested-item:visible .nested-value').each(function () {
+						addedObj.push($(this).val());
+					});
+					
+					$.ajax({
+						url: $this.data('source'),
+						dataType: 'json',
+						data: {
+							term: request.term,
+							added_obj: addedObj
+						},
+						success: function(data) {
+							response(data);
+						}
+					});
+				},
+		    minLength: parseInt($(this).data('min-length')) || 1,
+		    focus: function(e, ui) {
+					e.preventDefault();
+		      $this.val(ui.item.label);
+		    },
+		    select: function(e, ui) {
+		      var keepAfterSelect 	= (String($this.data('keep-after-select')).toLowerCase() == 'true'),
+							newId 						= createNewId(),
+							idRegexp 					= new RegExp($this.data('id'), 'g'),
+							content						= $.parseHTML( $this.data('item').replace(idRegexp, newId) );
+
+					e.preventDefault();
+					
+		     	if (!keepAfterSelect) {
+						$this.val('');
+					};
+					
+					$('.nested-content', content).text(ui.item.content);
+					$('.nested-value', content).val(ui.item.value);
+		      $('.nested-items').prepend(content);
+		    }
+		  });
+		});
+	});
+})(jQuery);

data/lib/dynamic_nested_forms.rb

@@ -0,0 +1,4 @@
+require "dynamic_nested_forms/engine" if defined?(Rails)
+
+module DynamicNestedForms
+end

data/lib/dynamic_nested_forms/engine.rb

@@ -0,0 +1,19 @@
+module DynamicNestedForms
+  class Engine < Rails::Engine
+    isolate_namespace DynamicNestedForms
+    
+    config.generators do |g|
+      g.test_framework :rspec
+    end
+    
+    # configure our plugin on boot
+    initializer 'dynamic_nested_forms' do
+      ActiveSupport.on_load(:action_view) do
+        require "dynamic_nested_forms/view_helpers"
+        class ActionView::Base
+          include DynamicNestedForms::ViewHelpers
+        end
+      end
+    end
+  end
+end

data/lib/dynamic_nested_forms/version.rb

@@ -0,0 +1,3 @@
+module DynamicNestedForms
+  VERSION = '0.1.0'
+end

data/lib/dynamic_nested_forms/view_helpers.rb

@@ -0,0 +1,44 @@
+module DynamicNestedForms
+  module ViewHelpers
+    # .nested-container
+    #   .nested-autocomplete
+    #   .nested-items
+    #    .nested-item
+    #     .nested-content
+    #     .nested-value
+    #     .remove-item
+    def autocomplete_to_add_item(name, f, association, source, options = {})
+      new_object              = f.object.send(association).klass.new
+      options[:class]         = ["autocomplete add-item", options[:class]].compact.join " "
+      options[:data]          ||= {}
+      options[:data][:id]     = new_object.object_id
+      options[:data][:source] = source
+      options[:data][:item]   = f.fields_for(association, new_object, child_index: options[:data][:id]) do |builder|
+        render(association.to_s.singularize + "_item", f: builder).gsub "\n", ""
+      end
+      
+      text_field_tag "autocomplete_nested_content", nil, options
+    end
+    
+    # def link_to_add_item(name, f, association, options = {})
+    #   options = data_attr name, f, association, options
+    #   link_to name, "#", options
+    # end
+    # 
+    # def data_attr(name, f, association, options = {})
+    #   new_object       = f.object.send(association).klass.new
+    #   options[:class]  = ["add-item", options[:class]].compact.join " "
+    #   options[:id]     = new_object.object_id
+    #   options[:item] = f.fields_for(association, new_object, child_index: options[:id]) do |builder|
+    #     render(association.to_s.singularize + "_item", f: builder).gsub "\n", ""
+    #   end
+    #   options
+    # end
+    
+    def link_to_remove_item(name = nil, options = {})
+      name ||= "Remove"
+      options[:class] = ["remove-item", options[:class]].compact.join " "
+      link_to name, "#", options
+    end
+  end
+end