title: nested form with jquery error :- new value overwriting previous selected values in the partial
body: <p>Well i am trying to do a dynamic combo select inside a partial. and the value of the batch no stays the same, ie whatever batch no i select in first partial rest of the partial has the same value.</p>
  
  <p>Code is as follows</p>
  
  <p>Form</p>
  
  <pre><code>&lt;%= nested_form_for(@bill) do |f| %&gt;
  
      &lt;%= f.label :name %&gt;&lt;br /&gt;
      &lt;%= f.text_field :name %&gt;
    &lt;%= f.link_to_add "add product", :bill_line_items %&gt;
      &lt;%= f.submit %&gt;
  &lt;% end %&gt;
  </code></pre>
  
  <p>the partial</p>
  
  <pre><code>&lt;%= javascript_include_tag 'testing' %&gt;
    &lt;div class ="kool"&gt;
  
    &lt;div class ="name"&gt;&lt;%= f.label :product_id %&gt;
  &lt;%= f.collection_select :product_id,Product.all ,:id,:name, :style =&gt; 'width:150px;'%&gt;&lt;/div&gt;&lt;br /&gt;
  
      &lt;div class="list"&gt;
      &lt;%= f.label :batch_no %&gt;&lt;br /&gt;
      &lt;%= f.grouped_collection_select :batch_no, Product.all, :store_opening_stocks, :id, :batch_no, :batch_no %&gt;&lt;br/&gt;&lt;/div&gt;
  
    &lt;/div&gt;
  </code></pre>
  
  <p>Js File</p>
  
  <pre><code>    jQuery(document).ready(function(){
         var batchNo = jQuery('.list').html();
  
    jQuery('.name').bind('change',function() {
  
       var  productSelected = jQuery('.name:selected').val();
  
     var options = jQuery(batchNo).find("optgroup[label='" + productSelected + "']").html();
  
       jQuery('.list select').html(options);
  
              });
            });
  </code></pre>
  
  <p>Screen Shots before selecting product</p>
  
  <p><img src="https://i.stack.imgur.com/jx8M1.png" alt="before Selecting the product"></p>
  
  <p>Screen Shot After selecting product and clicking on Add product</p>
  
  <p><img src="https://i.stack.imgur.com/z4A9D.png" alt="after selecting product and clicking add product"></p>
  
  <p>Screen shot after Reselecting product again</p>
  
  <p><img src="https://i.stack.imgur.com/uPKfG.png" alt="Reselecting product again"></p>
  
  <p>as you can see the Product-2 group i'e P1 and P2(batch nos of product 2) coming in second and third partial. and any attempt to change product, the batch nos show empty as shown in the picture. </p>
  
  <p>how do i solve this problem?? should i use <code>Parent</code> somewhere or <code>this</code> option?? Guidance required.</p>
  
  <p>Thanks in advance. :)</p>