0

我有一个带有 category_id 和 subcategory_id 属性的服装模型,我想这样做,以便当用户从 collection_select 中选择一个类别类型时,表单会以复选框的形式更新为该类别的子类别,供用户检查他需要的子类别,我可以检测到何时通过 $('#dress_category_id').change 使用 javascript 更改选择以及通过 $('#dress_category_id :selected').text() 选择了哪个类别类型,但我不知道,而我的搜索时间是徒劳的,然后如何使用子类别模型中的数据更新其他表单字段。

这是我的表单代码:

<div id="" class="modal-form no-shadow eighty-margin-top">
  <div class="modal-header">
  </div>
  <div class="form-box">
    <header class="ui-min-header">
      <h3 class="letter_pressed light_header ">New Design</h3>
    </header>
    <div class="form-body  row-fluid" style="margin-top: 20px;">
      <%= form_for( @dress, :html => {class: "form-horizontal", role:"form" }) do |f| %>
          <%= render "error_messages", target: @dress %>

          <div class="form-group" id="avatar">
            <%= f.label :category, class: "col-lg-3 control-label" %>
            <div class="col-lg-9">
              <%= f.collection_select :category, Category.all, :id, :name, {:prompt=> "Select a category"}, {class: "form-control input-lg"} %>
            </div>
          </div>
            </div>
          </div>
子类别在这里 -->
          <div class="form-group">
            <%= f.label :name, class: "col-lg-3 control-label" %>
            <div class="col-lg-9">
              <%= f.text_field :name, placeholder: "Name of your design", class: "form-control"  %>
            </div>
          </div>

          <div class="form-group">
            <%= f.label :keywords, class: "col-lg-3 control-label" %>
            <div class="col-lg-9">
              <%= f.text_field :keywords, class: "form-control"  %>
            </div>
          </div>

          <div class="form-group">
            <%= f.label :description, class: "col-lg-3 control-label" %>
            <div class="col-lg-9">
              <%= f.text_field :description, placeholder: "About your design", class: "form-control"  %>
            </div>
          </div>
          <div class="form-group">
            <div class="col-lg-offset-3 col-lg-9">
              <button type="submit" class="btn btn-warning">Continue</button><br/>
            </div>
          </div>
      <% end %>

    </div>

  </div>
</div>
4

1 回答 1

0

你可以看看jQuery Cascading Dropdown Plugin。要么直接使用它,要么查看它是如何在那里完成的。

于 2013-11-06T14:00:05.103 回答