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を持つIDS（＃）を交換する必要があります。