Simple Form - Rails 4 - editing

Question

I am trying to use simple form with my rails 4 app.

I have a project model, which has a scope model. Scope belongs to project. I have a third model, called participant, which belongs to scope. Scope accepts nested attributes for participant and project accepts nested attributes for scope.

When I create a new project, my form has partials which are nested forms for each of scope and participant. In my scope form, I ask whether this project involves participants. If the answer is true, I use JS form helper to show a hidden partial which contains the participant form.

If, after creating the project, I want to edit it, the edit function returns me to the project form, which shows the checkbox for participant (as true), but hides the participant form.

My question is, if the participant checkbox is checked as true, then the participant form nested in the project form should be revealed. My JS form helper hides this form until the box is checked as true, and this works fine in the create mode, but I need to un check the participant box in the scope form and re-check it in order to reveal the participant form - so that i can edit those fields.

Do you know how to reveal the participant form if the scope question asking about participation is true without unchecking and rechecking the form?

My code is as follows:

In my JS form helper, I have (which hides the participant nested form unless the scope question asking if participation is sought is true):

$(document).on 'change', '#' + inString +  '_scope_attributes_if_participant', ()->
  if $('#' + inString +  '_scope_attributes_if_participant').is(':checked')
    $('#participationrequest').show()
  else
    $('#participationrequest').hide()

In my scope form, I have:

    <%= s_all.input :if_participant, :as => :boolean, :label => false, inline_label: 'Public participants or volunteers' %>

Thank you

Answer 1

if $('#' + inString +  '_scope_attributes_if_participant').is(':checked')
  $('#participationrequest').show()
else
  $('#participationrequest').hide()
$(document).on 'change', '#' + inString +  '_scope_attributes_if_participant', ()->
  if $('#' + inString +  '_scope_attributes_if_participant').is(':checked')
    $('#participationrequest').show()
  else
    $('#participationrequest').hide()

Answer 2

You are currently only checking if the checkbox is checked when it is changed. However, when the form is loaded with the box checked, the change event isn't fired and thus your code doesn't execute.

To make the check run when the page loads, add something like this to your JS (forgive me for writing it in JS instead of coffeescript):

$(document).on('ready',function(){
    if $('#' + inString +  '_scope_attributes_if_participant').is(':checked')
       $('#participationrequest').show();
}

Note that you don't need the other part of the check here, as the default is hiding the #participationrequest element.

Answer 3

Try this:

<div id='participationrequest' style='<%= "display:none;" unless scope.if_participant? %>'>
    <%= render partial: 'you_form_partial' %>
</div>