ダイナミック選択メニューが、私はRailsが動的に選択メニューが含まれている子フィールドを持つフォームを入れ子にしている

Question

追加されたフィールドで作業していません私は動的なフィールドに選択データを読み込むために.html（）を取得することができなかったので、DOMの準備ができているメインフォームで "バックアップ" collection_selectを使用して、製品メニューをハックしました。私は改訂Railscast＃88をテンプレートコードとして使用しています。

実際の問題は、最初の選択メニューコンボのみが機能することです。追加のフィールドセットでカテゴリメニューを選択すると、すべてのメニューが失敗します。私は（この）メソッドを追加しようとしましたが、動作させることができました。

洞察力は大変高く評価されています。

Relevent js.coffee：

products = $('.products-backup').html() 
$('form').on 'change', '.category', (event) -> 
category = $('.category :selected').text() 
escaped_category = category.replace(/([ #;&,.+*~\':"!^$[\]()=>|\/@])/g, '\\$1') 
options = $(products).filter("optgroup[label='#{escaped_category}']").html() 
if options 
    $('.products').html(options) 
else 
    $('.products').empty() 

Releventレールが部分的html.erb - ノート、私は割り当てられた各選択メニューにクラス名：

<fieldset> 
<div class="field"> 
<%= f.collection_select :category_id, Category.all, :id, :name, { prompt: 'Select' }, 
{ :class => "category" } %> 
</div> 
<div class="field"> 
<%= f.grouped_collection_select :product_id, Category.order(:name), :products, 
:name, :id, :name, { prompt: 'Select' }, { :class => "products" } %> 
</div> 
#...more fields 
</fieldset> 

Answer 1

@Jeff、あなたのような何かをしたい、私のこの：

var $products_backup = $('#products_backup'); 
$('form').on('click', '.category', function() { 
    var $category = $(this); 
    if (!$category.is(":checked")) { 
     return; 
    } 
    var escaped_category = $category.val().replace(/([ #;&,.+*~\':"!^$[\]()=>|\/@])/g, '\\$1'); 
    var $options = $products_backup.find("optgroup[label='" + escaped_category + "']").find("option"); 
    //$('#products').empty().append('<option value="">Select an item</option>').append($options.clone()).val(""); 
    $category.closest('fieldset').find('.products').empty().append('<option value="">Select an item</option>').append($options.clone()).val(""); 
}); 

参照：

• DEMO（オリジナル）
• DEMO（更新）

私は.category要素がラジオボタンであるかもしれないことを推測見ていくように。そうでない場合は、コードを多かれ少なかれ調整する必要があります。