使用fields_for创建动态名称到单选按钮

时间:2016-07-13 04:37:24

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

目前我正在使用fields_for通过一个提交按钮提交多个表单(同一个对象)。一切都很好,只有一件事是我的单选按钮。由于fields_for为我的所有单选按钮创建了相同的名称组,因此每当我选择单选按钮时,其他表单中的单选按钮的值将被取消选中。因此,现在我想为每个表单中的单选按钮创建一个唯一/动态名称。 我的方法是我想在视图中创建变量索引,然后,每当我点击“add_inquery”时,按钮,索引变量将增加1。但是现在的第一个问题是我不知道为单选按钮的名称分配的语法。第二个问题,我如何使用Jquery更新索引变量,以便单选按钮将获得一个唯一的名称,如

<input class="non_bco" name="radio_button_group_1" type="radio" value="false" id="pricing_history__bco_false">

<input class="non_bco" name="radio_button_group_2" type="radio" value="false" id="pricing_history__bco_false">

<input class="non_bco" name="radio_button_group_3" type="radio" value="false" id="pricing_history__bco_false">

以下是我的文件:

_form_body.html.haml

%div.form-group.form-md-line-input
  %label.control-label.col-md-3
    = I18n.t('columns.customer_name')
    %span.required *
  %div.col-md-6
    = f.text_field :customer_name, placeholder: 'Customer Name', class: 'form-control'
    %div.form-control-focus
    %span.help-block Enter Customer Name
%div.form-group.form-md-line-input
  %label.control-label.col-md-3
    = I18n.t('columns.actual_customer')
    %span.required *
  %div.col-md-6
    = f.text_field :actual_customer, placeholder: 'Actual Customer', class: 'form-control actual_customer', disabled: true
    %div.form-control-focus
    %span.help-block Enter Actual Customer
%div.form-group.form-md-line-input
  %label.control-label.col-md-3
    = I18n.t('columns.bco')
    %span.required *
  .col-md-6
    .mt-radio-inline
      - index = 0
      %label.mt-radio
        = f.radio_button :bco, true, :checked => true, class: 'bco', name: 'radio_button_group_#{index}'
        = I18n.t('columns.bco_splited')
        %span
      %label.mt-radio
        = f.radio_button :bco, false, class: 'non_bco', name: 'radio_button_group_#{index}'
        = I18n.t('columns.non_bco_splited')
        %span
%div.form-group.form-md-line-input
  = f.label :trade_id, class: 'col-md-3 control-label' do
    = I18n.t('columns.trade')
    %span.required *
  %div.col-md-6
    = f.select :trade_id, options_for_select(Trade.all.map{|l| [l.name + '(' + l.code + ')', l.id]}, object.trade_id), {}, {class: 'form-control'}
    %div.form-control-focus
    %span.help-block Enter Trade
%div.form-group.form-md-line-input
  = f.label :trade_id, class: 'col-md-3 control-label' do
    = I18n.t('columns.sub_trade')
    %span.required *
  %div.col-md-6
    = f.select :sub_trade_id, options_for_select(SubTrade.all.map{|l| [l.name + '(' + l.code + ')', l.id]}, object.trade_id), {}, {class: 'form-control'}
    %div.form-control-focus
    %span.help-block Enter Sub Trade
%div.form-group.form-md-line-input
  = f.label :bound, class: 'col-md-3 control-label' do
    = I18n.t('columns.bound')
    %span.required *
  .col-md-6
    = f.select :bound, PricingHistory.get_bound_array,
      {}, {class: 'form-control select2_category'}
    %div.form-control-focus
    %span.help-block Enter Bound
%div.form-group.form-md-line-input
  = f.label :sales_week_id, class: 'col-md-3 control-label' do
    Sales Week
    %span.required *
  %div.col-md-6
    = f.select :sales_week_id, options_for_select(SalesWeek.all.map{|sw| [sw.display, sw.id]}, object.sales_week_id), {}, {class: 'form-control'}
    %div.form-control-focus
    %span.help-block Enter Sales Week
%div.form-group.form-md-line-input
  = f.label :origin_location_id, class: 'col-md-3 control-label' do
    Origin Location
    %span.required *
  %div.col-md-6
    = f.select :origin_location_id, options_for_select(Location.all.map{|l| [l.name + '(' + l.code + ')', l.id]}, object.origin_location_id), {}, {class: 'form-control'}
    %div.form-control-focus
    %span.help-block Enter Origin Location
%div.form-group.form-md-line-input
  = f.label :destination_location_id, class: 'col-md-3 control-label' do
    Destination Location
    %span.required *
  %div.col-md-6
    = f.select :destination_location_id, options_for_select(Location.all.map{|l| [l.name + '(' + l.code + ')', l.id]}, object.destination_location_id), {}, {class: 'form-control'}
    %div.form-control-focus
    %span.help-block Enter Destination Location
%div.form-group.form-md-line-input
  = f.label :surcharge_group_id, class: 'col-md-3 control-label' do
    Surcharge Group
    %span.required *
  %div.col-md-6
    = f.select :surcharge_group_id, options_for_select(SurchargeGroup.all.map{|s| [s.code, s.id]}, object.surcharge_group_id), {}, {class: 'form-control'}
    %div.form-control-focus
    %span.help-block Enter Surcharge Group Code
%div.form-group.form-md-line-input
  = f.label :commodity_group_id, class: 'col-md-3 control-label' do
    Commodity Group
    %span.required *
  %div.col-md-6
    = f.select :commodity_group_id, options_for_select(CommodityGroup.all.map{|s| [s.name + '(' + s.code + ')', s.id]}, object.surcharge_group_id), {}, {class: 'form-control'}
    %div.form-control-focus
    %span.help-block Enter Commodity Group
%div.form-group.form-md-line-input
  = f.label :tier_id, class: 'col-md-3 control-label' do
    Tier
    %span.required *
  %div.col-md-6
    = f.select :tier_id, options_for_select(Tier.all.map{|s| [s.tier, s.id]}, object.tier_id), {}, {class: 'form-control'}
    %div.form-control-focus
    %span.help-block Enter Tier
%div.form-group.form-md-line-input
  = f.label :d2_volume, class: 'col-md-3 control-label' do
    D2 Volume
    %span.required *
  %div.col-md-6
    = f.number_field :d2_volume, class: 'form-control', 'aria-required' => true, 'aria-describedby' => 'number-error'
    %div.form-control-focus
    %span.help-block Enter D2 Volume
%div.form-group.form-md-line-input
  = f.label :d4_volume, class: 'col-md-3 control-label' do
    D4 Volume
    %span.required *
  %div.col-md-6
    = f.number_field :d4_volume, class: 'form-control', 'aria-required' => true, 'aria-describedby' => 'number-error'
    %div.form-control-focus
    %span.help-block Enter D4 Volume
%div.form-group.form-md-line-input
  = f.label :d5_volume, class: 'col-md-3 control-label' do
    D5 Volume
    %span.required *
  %div.col-md-6
    = f.number_field :d5_volume, class: 'form-control', 'aria-required' => true, 'aria-describedby' => 'number-error'
    %div.form-control-focus
    %span.help-block Enter D5 Volume
%div.form-group.form-md-line-input
  = f.label :d7_volume, class: 'col-md-3 control-label' do
    D7 Volume
    %span.required *
  %div.col-md-6
    = f.number_field :d7_volume, class: 'form-control', 'aria-required' => true, 'aria-describedby' => 'number-error'
    %div.form-control-focus
    %span.help-block Enter D7 Volume
%div.form-group.form-md-line-input
  = f.label :r2_volume, class: 'col-md-3 control-label' do
    R2 Volume
    %span.required *
  %div.col-md-6
    = f.number_field :r2_volume, class: 'form-control', 'aria-required' => true, 'aria-describedby' => 'number-error'
    %div.form-control-focus
    %span.help-block Enter R2 Volume
%div.form-group.form-md-line-input
  = f.label :r5_volume, class: 'col-md-3 control-label' do
    R5 Volume
    %span.required *
  %div.col-md-6
    = f.text_field :r5_volume, class: 'form-control', 'aria-required' => true, 'aria-describedby' => 'number-error'
    %div.form-control-focus
    %span.help-block Enter R5 Volume

_form.html.haml

.col-md-3
  = link_to "Add Inquery", pricing_histories_add_inquery_path, remote: true, class: 'btn btn-default add-form-button', data: {disable_with: "Please wait..."}


= form_for @pricing_history, html: {class: 'form-horizontal'} do |f|
  %div.row
    %div.col-xs-12.form-body
      = f.fields_for '' do |fd|
        = render 'form_body', f: fd, object: f.object
  %div.form-actions
    %div.row
      %div.col-md-offset-9.col-md-3
        %button.btn.green{:type => 'submit'} Submit

0 个答案:

没有答案