ajax 调用添加选项时从选择框中选择一个值答案

【问题标题】：Selecting a value from the select box when options added by an ajax callajax 调用添加选项时从选择框中选择一个值
【发布时间】：2010-02-04 02:09:28
【问题描述】：

我有一个添加食谱的表单，用户可以在同一个表单中添加多个食谱成分。用户添加的每种成分都是通过 ajax 调用完成的，这样我就不必显示选择的成分框。当用户选择一种成分时，所选成分的 id 存储在隐藏的输入中

  <%= builder.hidden_field :ingredient_id %></div>

当用户从列表中选择一种成分时，会触发一个 ajax 调用来填充另一个选择框，该框显示基于该成分的所有份量。当我添加新食谱时，这个设置非常有效。

我在编辑模式下打开现有配方时遇到问题...

我有以下html

<%= builder.hidden_field :ingredient_id %>
<%= builder.select(:serving_size_id, '') %>

jQuery 代码

jQuery.fn.bindServingSizes = function(ingredientid) {
    var $this = $(this);

    $.getJSON("/serving_sizes?ingredientid=" + ingredientid, function(j) {

        var options = "<option value=''>Please select a serving size</option>";
    for (var i=0; i < j.length; i++)
      options += '<option value="' + j[i].serving_size.id + '">' + j[i].serving_size.name + '</option>';

        $this.html(options);
    });
  };

我有一个 ajax 调用，它在页面加载时运行，它读取隐藏输入中的值并获取份量并将其作为选项添加到选择框。 我的问题：如何在选择框中选择正确的选项？我在“serving_size_id”列中有数据，但我不知道如何获取它的值，因此我可以按值设置正确的选定项。

我希望我的解释足够清楚。

【问题讨论】：

标签： ruby-on-rails

【解决方案1】：

我根本不是 jQuery 专家，但从您的示例看起来我看到您只是创建 HTML 来提供可用选项。

因此，您可以将selected="selected" 属性添加到与serving_size_id 的值对应的选项中。可以使用 jQuery 从serving_size_id 获取值：

var serving_size = $("#serving_size_id").val();

此值可在您的 for 循环中用于“查找”所选选项。

【讨论】：

我很抱歉，因为我想我可能把你带错了路。我的问题是，如何从“serving_size_id”列中获取值。如果我能以某种方式获得值，我可以使用 jQuery 来设置选定的索引。
没问题我修改了我的答案。希望现在（更）清楚了吗？

【解决方案2】：

使用jQuery，您可以通过以下方式设置选中的<option>：

$(combo).val('selectedValue'); // *

文档：http://api.jquery.com/val/#val2

_{*您的代码不允许我在示例代码中使用真实姓名和值}

【讨论】：