【问题标题】:How to combine two select fields in a form如何在表单中组合两个选择字段
【发布时间】:2015-07-23 19:47:46
【问题描述】:

我正在尝试在提交表单之前将表单中两个选择字段的值组合成一个变量。

这是我的代码:

在 new.html.erb(用于 RoR)中:

<%= form_for :character, url: characters_path, method: :post do |f| %>
  <p>
     <%= f.label :alignment %><br>
     <%= f.select :alignment_lr, options_for_select([" ","Chaotic","Neutral","Lawful"], disabled: " ", selected: " ") %>
     <%= f.select :alignment_ud, options_for_select([" ","Good","Neutral","Evil"], disabled: " ", selected: " ") %>
  </p>
<% end %>

这会生成以下 html:

<p>
  <label for="character_alignment">Alignment</label><br>
  <select id="character_alignment_lr" name="character[alignment_lr]">
    <option disabled="disabled" selected="selected" value=" "> </option>
    <option value="Chaotic">Chaotic</option>
    <option value="Neutral">Neutral</option>
    <option value="Lawful">Lawful</option></select>
  <select id="character_alignment_ud" name="character[alignment_ud]">
    <option disabled="disabled" selected="selected" value=" "> </option>
    <option value="Good">Good</option>
    <option value="Neutral">Neutral</option>
    <option value="Evil">Evil</option></select>
</p>

如何组合为:alignment_lr:alignment_ud 选择的值以等于alignment.value = alignment_lr.value + ' ' + alignment_ud.value 之类的值?

我愿意使用 javascript 或 jquery 来解决这个问题。

【问题讨论】:

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


    【解决方案1】:

    我认为最好添加一个隐藏输入来存储这两个值;

    <input id="character_alignment" type="hidden" name="character[alignment]" value=""/>
    
    <script type="text/javascript">
    $(document).ready(function() {
    
    // for the first select
    $("#character_alignment_lr").change(function(){
        setCharacterAlignment();
    });
    
    
    // for the second select
    $("#character_alignment_lr").change(function(){
        setCharacterAlignment();    
    });
    
    });
    
    function setCharacterAlignment()
    {
        // get dropdown selected option
        var val1 = $('#character_alignment_lr option:selected').val();
        var val2 = $('#character_alignment_ud option:selected').val();
    
        // set hidden input value
        $("#character_alignment").val(val1 + " " + val2);
    }
    
    </script>
    

    【讨论】:

    • 您也可以在提交表单时更新隐藏字段,使用.submit()。当然,除非该值也在其他地方使用。
    【解决方案2】:

    实际上根本不需要使用脚本。您似乎对将对齐变量的组件保留为模型中的单独字段没有真正的兴趣,所以简短的回答是:不要这样做。

    您可以使用虚拟属性在表单中记录值,然后在模型中应用逻辑来创建通过 ActiveRecord 保存到数据库的实际值。虚拟属性允许您的表单具有与模型中的字段不直接对应的字段。

    1. 创建一个迁移,删除您的“alignment_lr”和“alignment_ud”列并用单列“对齐”替换它们。理想情况下,您应该以这样一种方式对数据库进行规范化,即每个对齐组合都保存到对齐表中,并且您将保存一个键,而不是动态生成的字符串,但这是一个不同的问题;

    2. 在您的 Character.rb 模型中,添加 attr_accessor 行:

      class Character < ActiveRecord::Base
      
          attr_accessor: :alignment_lr, :alignment_ud
      
    3. 在您的characters_controller.rb 文件中,将:alignment_lr:alignment_ud 添加到您的强参数(character_params 方法)

    4. 您仍然可以完全按照已有的方式编写 f.select 语句。

    5. 在您的characters_controller.rbcreate 方法中:

      @character.combine_alignment(@character.alignment_lr, @character.alignment_ud)
      
    6. 在您的 Character.rb 中,添加 combine_alignment 方法:

      def combine_alignment(left_right, up_down)
         return "#{left_right} #{up_down}"
      end
      

    【讨论】:

    • 感谢您的回复,@MarsAtomic。我现在收到以下错误:NoMethodError in CharactersController#create undefined method left_right' for #<0x5d1cad0>
    【解决方案3】:

    您可以通过以下几种方式做到这一点:

    在controller里面的create方法里面可以放:

    alignment.value = params[:character][:alignment_lr] + ' ' + params[:character][:alignment_ud]
    

    @character = Character.new(character_params)
    @character.alignment = @character.alignment_lr + " " + @character.alignment_ud
    

    如果您想使用 javascript,您可以使用隐藏字段来连接两个字段,如 @Ceparu Stefan 所示

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-10-07
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多