Question

我有一个带有Simple Form和Bootstrap的rails 4应用程序。

我的表格中有几个问题，如果回答为真，则需要进一步输入。我想隐藏次要问题，直到用户回答主要问题为真。

这一对问题就是一个例子：

<%= f.input :survey, :as => :boolean, :label => false, inline_label: 'Do you need survey     responses?'  %>
<br><br>


    <%= f.input :survey_link, label: 'Where is your survey?', :label_html => { :class => 'question-data' }, placeholder: 'Include a link to your survey', :input_html => {:style=> 'width: 650px; margin-top: 20px',  class: 'response-project'} %>

我的形式有这个javascript：

<script>
$(function() {
    // Hide the survey_link input
    $('input[name="user[survey_link]"]').hide();
    $('input[name="user[survey_link]"]').closest("label").hide();

    // When the survey checkbox changes
    $('input[name="user[survey]"]').change(function() {
         $('input[name="user[survey_link]"]').closest("label").toggle(this.checked);
         $('input[name="user[survey_link]"]').toggle(this.checked);
    });
});
</script>

我的目标是隐藏整个'survey_link'字段，直到第一个问题的回答为真。使用此JS隐藏输入字段，但标签“您的调查在哪里？”没有隐藏。一个建议是为每个后续问题单独定义单独的类，以便我可以通过类名隐藏它们。在我更改CSS之前，我想知道是否有更好的方法来解决这个问题？

谢谢。

带有Rails简单表单和引导程序的Javascript

0 个答案: