Rails嵌套窗體與select2

Question

我使用cocoon gem作爲嵌套窗體並使用select2作爲自定義選擇。

第一個集合select已按預期工作。當我添加另一個選擇項目時，即使選擇的項目具有相同的類別，它也不起作用。我試過this解決方案。但它沒有解決我的問題。因爲我已經調用了嵌套項目。

_form.html

<%= simple_form_for(@course) do |f| %> 
    <%= f.simple_fields_for :course_teachers do |course_teacher| %> 
    <%= render "course_teacher_fields", :f => course_teacher %> 
    <% end %> 
    <div class="links"> 
    <%= link_to_add_association 'Add Teacher', f, :course_teachers, class:"btn btn-info" %> 
    </div> 
<%end%> 

_course_teacher_fields.html

<div class="nested-fields"> 
    <%= f.association :teacher, collection: Teacher.all, label_method: :full_name_with_title, input_html: {class: "teacher"} %><br/> 
</div> 

app.js

$(".teacher").select2({ 
    placeholder: "Select Teacher", 
    allowClear: true 
}); 

你有什麼想法？

Answer 1

問題是，您的JavaScript只初始化select2，只有一次，已呈現的項目（這就是爲什麼你沒有問題的第一個選擇），但添加另一個後，select2()不會觸發和未在該項目上初始化。

爲了解決這個問題，在`cocoon：after-insert'之後添加一個回調，並在添加的行上觸發select2事件。

所以你的JavaScript將類似於

function init_select2(selector){ 
    $(selector).select2({ 
    placeholder: "Select Teacher", 
    allowClear: true 
    }); 
}; 

init_select2(".teacher") 

$("form").on("cocoon:after-insert", function(_, row){ 
    field = $(row).find(".teacher") 
    init_select2(field); 
}); 

我還沒有測試此代碼，但我希望你的想法。