动态地将字段添加到嵌套表单onchange的select

时间:2014-05-26 06:15:10

标签: javascript jquery ruby-on-rails forms nested-forms

我在点击add_fields和remove_fields时成功添加和删除字段。但现在我想一次添加字段N次,具体取决于父窗体中下拉列表的值。 如何做到这一点? 这是我的父表格

= f.select :total_section, (0..10),{}, :onchange => "generate_form(this.value)"
    .field
      = f.fields_for :score_sheet_sections do |s|
        %div.fields
          = render 'score_sheet_section_fields', :f => s
      %div.fields
        = link_to_add_fields "Add Score Sheet Sections", f, :score_sheet_sections

在我的生成表单功能中,我只有这个:

function generate_form(number) {
      for (i = 1; i <= number; i++) {
          console.log(i);
      }
  }

我想选择多个部分(比如N或将其存储在N中)然后再添加score_sheet_sections N次

2 个答案:

答案 0 :(得分:2)

  

选择部分的数量(比如N或将其存储在N中),然后添加   score_sheet_sections N次)

我目前还不知道您是如何处理此问题的,但如果您使用类似的方法this(使用Ajax调用单独方法的I.E) ,您可能希望在方法中包含一个参数,该参数允许您根据参数返回行数,如下所示:

-

<强>路线

#config/routes.rb
resources :controller do
   collection do
      get :new_field
   end
end

-

<强>控制器

#app/controllers/your_controller.rb
respond_to :js, only: :new_field

def new_field num = 1 #-> arg defaults to 1
   num = params[:num] if params[:num]

   @model = Model.new
   @model.nested_categories.build

   render "controller/form", num: num
end

#app/views/controller/new_field.html.erb
<%= form_for @model do |f| %>
    <%= render partial: "field", locals: { num: parmas[:num], f: f } %>
<% end %>

#app/views/controller/_field.html.erb
<% num.each do |i| %>
    <%= f.fields_for :association, child_index: Time.now.to_i do |a| %>
         <%= a.text_field :attribute %>
    <% end %>
<% end %>

-

** JS **

= f.select :total_section, (0..10),{}, :onchange => "generate_form(this.value)"

#app/assets/javascripts/application.js.erb
var generate_form = function( num ){
   $.ajax({
       url: "new_fields/?num=" + num,
       type: "GET",
       success: function(data) {
           //append returned data to view
       }          
   })
}
  • 根据this SO post,您可以在GET请求中将数据附加到网址

这将为您的ajax请求返回一个内置表单,允许您解析它&amp;附加到视图

答案 1 :(得分:1)

只需按照此railscasts教程添加和删除嵌套资源字段http://railscasts.com/episodes/197-nested-model-form-part-2?view=asciicasthttp://railscasts.com/episodes/196-nested-model-form-revised?view=comments

如果需要更多帮助,请告诉我。