どのようにjQueryを使って、レール2.0のルビーでドロップダウンリストを選択できますか？

Question

こんにちは私は2つのドロップダウンリストを作ろうとしています。最初はすべてのカテゴリを表示したいと思っています。ユーザーが希望するカテゴリを選択すると、自動的に選択したカテゴリのすべてのサブカテゴリが表示され、サブカテゴリIDが保存されます。私はそれをどのようにすることができますか？

サブカテゴリとカテゴリの関係は、サブカテゴリのカテゴリIDを整数フォーマットで保存していることです。

ここは私のコードで、今まで何をしていますか？ jqueryの

<script type="text/javascript"> 
$(document).ready(function() { 
// hides the slickbox as soon as the DOM is ready 
    $('#subcategory_value_id').hide(); 
     $('div#category_value').change(function() { 
        var category_id = ""; 

      $("select option:selected").each(function() { 
      category_id += $(this).text(); 
       }); 
     $("div#test").text(category_id); 
     $('#subcategory_value_id').toggle(); 
     }) 
     }); 
    </script> 

<div id="category_value">Country: 
<%= f.collection_select :id, Category.find(:all), :id, :name, :prompt => "Select a Category" %></div> 
</p> 
<p> 
    <div id="subcategory_value_id">State or Province: 
    <%= f.collection_select :id, Subcategory.find(:all), :id, :name, :prompt => "Select a Subcategory" %></div> 
</p> 
<div id="test"></div> 

とそれほど慣れていないイムは、私は国でこれを行われ、this projectに述べてきたあなたに

Answer 1

ありがとうございます。

ここでは簡略化され、ビューの：

• は、国や州でJSON構造を移入するAJAX要求を行います：

  <%= address.collection_select :country_id, Country.all, :id, :name, { :selected => address.object.country_id.to_s } %> 
  <%= address.collection_select :state_id, address.country.states, :id, :name, { :selected => address.object.state_id.to_s } %> 
  

  HereはJavaScriptをということです。

• 国selectにonchangeイベントを追加します。これにより、状態selectが更新されます。

私のコードでは、請求と発送先アドレスの両方にロジックが適用されることに注意してください。また、自分のコードでは、あなたの場合には必要ではない状態フィールドにテキストが許可されています。必ずAJAX呼び出しでJSON配列を生成する必要はありません。はとなる可能性があります。あなたが見たいと思っているものは、onchangeイベントの機能です。