Rails依赖表单字段

时间:2017-07-13 16:51:05

标签: ruby-on-rails forms

我正在使用dependent fields rails gemthis video tutorial尝试在我的用户注册表单中实现依赖字段。我的注册表单有一个字段,用户可以在其中选择自己的角色(使用枚举实现)。我希望大学字段默认隐藏,只有在用户选择" staff"作为他们的角色。当前行为是所有表单字段在加载时都可见。我究竟做错了什么?任何有关newb的帮助将不胜感激!我已经阅读了其他SO问题,但似乎无法解决这个问题。

这是我的表格:

<% provide(:title, 'Sign up') %>
<h1>Sign up</h1>

<div class="row">
  <div class="col-md-6 col-md-offset-3">
    <%= form_for(@user) do |f| %>
      <%= render 'shared/error_messages', object: f.object %>
      <%= f.label :name %>
      <%= f.text_field :name, class: 'form-control' %>

      <%= f.label :email %>
      <%= f.email_field :email, class: 'form-control' %>

      <%= f.label :role %>
      <%= f.select(:role, User.roles.keys.map {|role| [role.titleize,role]}, :include_blank => "Please Select")  %>

      <%= content_tag :div, class: 'js-dependent-fields', data: { 'data-select-id': 'user_role', 'data-option-value': 'staff'} do %>
      <%= f.label :university_id%>
      <%= collection_select( :user, :university_id, University.all, :id, :name, prompt: true) %>
      <% end %>

      <%= f.label :password %>
      <%= f.password_field :password, class: 'form-control' %>

      <%= f.label :password_confirmation, "Confirmation" %>
      <%= f.password_field :password_confirmation, class: 'form-control' %>

      <%= f.submit "Create my account", class: "btn btn-primary" %>
    <% end %>
  </div>
</div>

这是我的application.js的下半部分:

//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require bootstrap
//= require turbolinks
//= require underscore
//= require dependent-fields
//= require_tree .

 $(document).ready(function() {
     DependentFields.bind()
 });

1 个答案:

答案 0 :(得分:1)

可能不是原因,但您的数据属性附加了一个额外的“数据”块我相信:

<%= content_tag :div, class: 'js-dependent-fields', data: { 'data-select-id': 'user_role', 'data-option-value': 'staff'} do %>
  vv
<%= content_tag :div, class: 'js-dependent-fields', data: { 'select-id': 'user_role', 'option-value': 'staff'} do %>