2017-06-22 190 views
0

我有两个隐藏的字段。当一个特定的单选按钮被点击时,我需要出现的字段。我不确定它为什么不起作用。我已经包含下面的代码。隐藏的div不会隐藏/显示在单选按钮上点击

html.erb文件:

<div class="row"> 
    <div class="mate-photo-label col-sm-4"> 
    <%= f.radio_button :check_request_type_id, '4' %><br><br> 
    <%= f.label :check_request_type_id, 'Commission Invoice', value: '4', class: 'text' %> 
    </div> 
    <div class="mate-photo-label col-sm-4"> 
    <%= f.radio_button :check_request_type_id, '2' %><br><br> 
    <%= f.label :check_request_type_id, 'Client Refund', value: '2', class: 'text' %> 
    </div> 
    <div class="mate-photo-label col-sm-4"> 
    <%= f.radio_button :check_request_type_id, '1' %><br><br> 
    <%= f.label :check_request_type_id, 'Landlord Reimbursement', value: '1', class: 'text' %> 
    </div> 
</div> 

html.erb文件#2:

<div class="commission-fields" style="display: none;"> 
    <div class="field"> 
    <%= f.label :commission_collected, "Commission Collected", class: "general-text-label" %><br> 
    <%= f.text_field :commission_collected, class: "general-text-field" %> 
    </div> 
    <div class="field"> 
    <%= f.label :commission_percentage, "Your Commission Percentage", class: "general-text-label" %><br> 
    <%= f.text_field :commission_percentage, class: "general-text-field" %> 
    </div> 
</div> 

js.file:

$(document).ready(function() { 
    $('input').change(function() { 
    if ($('input[value="4"]').is(':checked')) { 
     $('#commission-fields').show(); 
    } 
    else { 
     $('#commission-fields').hide(); 
    } 
    }); 
}); 
+0

在你的js中,试试'$(“:input”)'看到[这里](https://api.jquery.com/input-selector/) –

+0

@NoamHacker那对我没有用。 –

+2

man,你正在使用'#'而不是'''作为你的jquery中的选择器,那是一个类,而不是一个id。 – fanta

回答

3

的问题是联合国的jQuery选择显示隐藏要素,更改:

$('#commission-fields').show(); 

$('#commission-fields').hide(); 

到:

$('.commission-fields').show(); 
$('.commission-fields').hide(); 
0

看样子你没有链接到图书馆的jQuery功能。

尝试在你的头添加此:

<script src="jquery-3.2.1.min.js"></script> 
+0

感谢您的反馈,但这不是问题。 jQuery CDN已经添加到别处了。 –

相关问题