【问题标题】:How to display options in collection_select from controller rails如何从控制器导轨中显示 collection_select 中的选项
【发布时间】:2019-11-30 01:52:19
【问题描述】:

我有一个场景,在选择 designation 时,benefits 将根据 designation 在下拉列表中加载。 我为此编写了一个 ajax 调用。

HTML:

<label>Designations</label>
<%= f.association :designation, input_html: { id: 'designation_select'},label_html: { class: 'form-control-plaintext' } %>

<label>Benefits</label>
<%= f.collection_select :benefit_ids, Benefit.all,:id, :name, {}, { id: 'benefit_select',multiple: 'multiple', :class => 'form-control multiselect-all',:include_blank => "Select Benefit" } %>

AJAX 调用:

<script type="text/javascript">
  document.addEventListener("turbolinks:load", function() {

    $('#designation_select').change(function() {
      debugger
      id = $('#designation_select')[0].value;
      $.ajax({
          type: 'GET',
          dataType: 'html',
          data: {designation_id: id},
          url: '/benefits/benefit_by_designation',
          success: function(result) {
            debugger
            var el, length, options, parser, results, x;
            $('#benefit_select').empty();
            $('#benefit_select').prepend('<option value=\'\'> Select Benefit </option>');
            parser = new DOMParser;
            el = parser.parseFromString(result, 'text/html');
            options = el.getElementsByTagName('option');
            length = options.length;
            x = 0;
            results = [];
            while (x < length) {
              $('#designation_select')[0].appendChild(options[0]);
              results.push(x++);
            }
            return results;
          }
        });
    });
});
</script>

控制器中的方法

  def benefit_by_designation
    benefits = Benefit.where('designation_id = ?', params[:designation_id])
    render html: view_context.options_from_collection_for_select(benefits, :id, :name, {include_blank: 'Select Benefit'})
  end

在控制器中的benefits = Benefit.where.. 查询之前,代码运行得非常好,但render html: 没有按我希望的那样工作。如何在下拉列表中显示 benefits 列表?

编辑: 我不小心将 ajax 调用中的datatype 设置为json,但我现在将其设置为html。现在,ajax调用成功案例正在命中,但仍然没有显示结果。

【问题讨论】:

  • 如果你使用的是ajax,你不是还需要respond_to :js 吗?
  • 我不知道,你告诉我..

标签: html ruby-on-rails ajax


【解决方案1】:

试试

def benefit_by_designation
 benefits = Benefit.where('designation_id = ?', params[:designation_id])
 render json: {:benefits => benefits }
end

将您的 ajax 成功更改为

success: function(result) {
         var options='';
          options += '<option value=\'\'> Select Benefit </option>';
          if(result.benefits)
            $.each(result.benefits,function(key, val){
              options += '<option value="'+val['id']+'">'+val['name']+'</option>';
            });
          var option_set = $('#benefit_select').html(options);
          option_set.trigger('change');
        }

希望这会有所帮助..

【讨论】:

  • 没用。虽然控制台没有记录任何错误,但结果也没有显示在页面上:(
  • 你能在成功方法console.log(result.benefits) 中控制result.benefits 并查看输出结果
  • 它显示了在成功案例0: {id: 72, name: "Car Insurance", created_at: "2019-07-19T10:38:30.305Z", updated_at: "2019-07-19T10:38:30.305Z", designation_id: 1, …}1: {id: 73, name: "Health insurance", created_at: "2019-07-19T10:38:39.594Z", updated_at: "2019-07-19T10:38:39.594Z", designation_id: 1, …}中应该出现在下拉列表中的2个选项
  • 将您的选择更改为&lt;%= f.select :benefit_ids, Benefit.all.collect {|p| [ p.name, p.id ] }, {:prompt=&gt;""}, { :multiple =&gt; false, :size =&gt; 0 ,:class=&gt; "form-control multiselect-all", :id=&gt; "benefit_select" } %&gt;
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-09-23
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2012-09-22
相关资源
最近更新 更多