将 f.select 参数发送到 jquery 并显示动态表单元素

Question

我有一个使用嵌套表单的表单。当 f.select 选择 unificação 选项时，我希望他出现。

我使用我在示例中看到的示例，当我选择一个新选项时会出现警报，但我不知道我如何将所选元素发送到功能以及我如何告诉他显示 f.fields_for ：统一。

<div class="form-row">
    <label>
        <span>Evento</span>
            <%= f.select :event, ['Reencaminhar', 'Reclassificar', 'Rejeitar alteracão de diagnóstico', 'Rejeitar reencaminhamento', 'Solicitar esclarecimento', 'Cancelar solicitação', 'Rejeitar cancelamento', 'Responder', 'Unificação', 'Envio de cópia de ID', 'Reiterar', 'Registrar Solicitação', 'Reabrir solicitação', 'Complementar solicitação'], {}, :onChange => "fillForm.test(this)" %>
    </label>      

</div>

<%= f.fields_for :unifications do |unification_form| %>
    <label>
        <%= unification_form.link_to_remove "Remover cpf" %>
        <%= unification_form.text_field :cpf %>      
    </label>
<% end %>

requests.coffee 

@fillForm =
    test: ->
        alert('Hello world')

Answer 1

添加一个 div 来隐藏/显示嵌套的表单块：

<div id="attributes-to-display" style="display:none">
  <%= f.fields_for :unifications do |unification_form| %>
    <label>
      <%= unification_form.link_to_remove "Remover cpf" %>
      <%= unification_form.text_field :cpf %>      
    </label>
  <% end %>
</div>

默认隐藏。我不使用咖啡脚本，所以使用纯 javascript 的可能解决方案：

// binds the change event
$("#the_select_id").on('change', function() {
  // checks if the selected value is what you expect
  if ($(this).val() == "whatever") {
    // if so, show the block
    $("#attributes-to-display").show();
  }
  else {
    // if not, hide the block
    $("#attributes-to-display").hide();
    // and clean the cpf input box
    $("#the_nested_input_id").val('');
  }
});

您需要用正确的表单 ID 替换 ID (#)，因为我没有足够的信息来提供它。