ruby-on-rails – 如何隐藏部分rails 3表单,具体取决于从下拉菜单中选择的值

<%= form_for(@project) do |f| %>
  <div class="field">
    <%= f.label "Project Status" %><br />
    <%= f.SELEct :status,["In Progress","Cancelled"] %>
  </div>

  <div class="field">
    <%= f.label "Capital Cost" %><br />
    <%= f.text_field :capital_cost %>
  </div>

  <div class="actions">
    <%= f.submit %>
  </div>

<% end %>

解决方法

默认情况下,Rails 3通过在Gemfile中包含jquery_rails gem来启用jQuery.假设您的应用中包含了jquery_rails,并且< SELEct>和<输入>标签分别有#project_status和#project_capital_cost ID,通过必要的修改将以下脚本添加到_form部分：

<script>
  $(document).ready(function(){
     if($('#project_status').val() != "In Progress"){
        $("#project_capital_cost").attr('disabled','disabled');
     }
     else{
        $("#project_capital_cost").removeAttr('disabled');
     }

     $('#project_status').change(function(){
        if($(this).val() != "In Progress"){
          $("#project_capital_cost").attr('disabled','disabled');
        }
        else{
          $("#project_capital_cost").removeAttr('disabled');
        }
     })
  });

</script>

编辑：

隐藏div给它一些id：

<div class="field" id="my_div">
    <%= f.label "Capital Cost" %><br />
    <%= f.text_field :capital_cost %>
  </div>

然后更换

$( “#project_capital_cost”)ATTR( ‘禁用’,‘禁用’). with $(“#my_div”).css(‘display’,’none’)

和

$( “#project_capital_cost”)removeAttr( ‘禁用’).在脚本中使用$(“#my_div”).css(‘display’,’block’).