* EDIT *
I am using a Foundation theme and I believe the problem lies therein. I created a new basic app and had no issues until I added the theme. I will update this when I find the culprit.
* PREVIOUS EDIT *
I wanted to eliminate some of the variables in the scenario, so I tested this by using form_for instead of simple_form_for with no success.
In Cocoon's doc, it mentioned :wrapper => 'bootstrap' option for newer versions of Bootstrap and I did use the similar foundation wrapper that simple_form provides with no success.
= simple_form_for @group, :wrapper => 'foundation', :html => {:class => 'form-vertical' } do |f|
...
= f.simple_fields_for :solicitations do |solicitation|
= render 'solicitation_fields', :f => solicitation
.links
= link_to_add_association "Add Invitation?", f, :solicitations, :render_options => { :wrapper => 'foundation' }
I removed much of the styling in the event it is a factor. It isn't.
FWIW, I am using Ruby 2.1 as recommended on the Rails site. Plus, I have a headache from excessive wall banging.
The bottom line question: Why is the trigger that displays the partial not working?
* END EDIT *
I would very much like to use Nathanvda's Cocoon gem, but cannot get the associated nested form to show after clicking the link_to_add_to_association. A confirm message does appear. I seem to be missing something or perhaps my use of simple_form, zurb, and cocoon complicate the solution.
- rails 4.0.2
- simple_form 3.0.1
- zurb-foundation 4.3.2
- cocoon 1.2.5
Files:
... Models
class Group < ActiveRecord::Base
has_many :solicitations, :dependent => :destroy
accepts_nested_attributes_for :solicitations, reject_if: :all_blank
class Solicitation < ActiveRecord::Base
belongs_to :group
... Controller
class GroupsController < ApplicationController
before_action :authenticate_user!
before_action :set_group, only: [:show, :edit, :update, :destroy]
before_action :set_current_user, only: [:index, :edit, :update, :create]
def new
@group = Group.new
respond_to do |format|
format.html
format.json { render json: @group }
end
end
def create
@group = Group.new(group_params)
respond_to do |format|
if @group.save
format.html { redirect_to action: :index, notice: 'Group was successfully created.' }
format.json { render json: @group, status: :created, location: @group }
else
format.html { render action: "new" }
format.json { render json: @group.errors, status: :unprocessable_entity }
end
end
end
private
def group_params
params.require(:group).permit( :name, :id,
solicitations_attributes: [ :id, :email, :name, :role, :_destroy ] )
... Form Partial _solicitation_fields.html.haml
= simple_form_for @group, :html => {:class => 'form-vertical' } do |f|
= f.error_notification
.fields
.row
.large-12.columns
= f.input :name, :required => true, placeholder: 'A descriptive group name'
%hr
.large-12.columns
%h4 Group Solicitations
.large-12.columns
%table.responsive
%thead
%tr
- headings = ["* Name", "* Email", "* Role", ""]
- headings.each do |heading|
%th= heading
%tbody
= f.simple_fields_for :solicitations do |solicitation|
= render 'solicitation_fields', :f => solicitation
.links
= link_to_add_association "Add Solicitation?", f, :solicitations, confirm: "Does this work?"
.large-12.columns
.row
.large-12.columns
= f.error :base
= f.button :submit, class: "button radius"
... groups.js
$(document).ready(function() {
$('#solicitations').bind('cocoon:before-insert', function(e,solicitation_to_be_added) {
solicitation_to_be_added.fadeIn('slow');
});
$('#solicitations').bind('cocoon:after-insert', function(e, added_solicitation) {
//added_solicitation.css("background","red");
});
$('#solicitations').bind('cocoon:before-remove', function(e, solicitation) {
$(this).data('remove-timeout', 1000);
solicitation.fadeOut('slow');
})
});...
Frankly, I'm a weak on the js side of things. I've been working on this for several days and don't want to quit, so any help or direction would be appreciated. I have seen that Bootstrap requires some inline wrappers to work with cocoon and simple_form, but it does seem the simple_form initializer has changed quite a bit from nathanvda's demo example on github.
Also, I can display the partial when I explicitly put @group.solicitations.build in the controller action, but I do not see that process in the demo.
