title: updating selectbox using ajax in rails
body: <p>I am trying to update a selectbox of a form using ajax after creating a record but I get the following error:</p>
  
  <pre><code>ActionView::Template::Error (undefined local variable or method `f' for #&lt;#&lt;Class:0x89d20be8&gt;:0x89d05118&gt;):
      1: &lt;%= f.label :Sector, "Sector:", class: "control-label col-md-3"  %&gt;
      2: &lt;div class="col-md-4"&gt;
      3:   &lt;%= f.select :Sector, options_for_select(@catgrupos.map{|e|[e.Descripcion, e.Clave]}) %&gt;
      4:   &lt;button type="button" class="btn btn-default" data-toggle="modal" data-target="#mynewcategory"&gt;
    app/views/productos/_sector.html.erb:1:in `_app_views_productos__sector_html_erb___812830609__998268098'
    app/views/catgrupos/create.js.erb:4:in `_app_views_catgrupos_create_js_erb___970001663__998252138'
  </code></pre>
  
  <p>This is my partial _sector containing the select box:</p>
  
  <pre><code>&lt;%= f.label :Sector, "Sector:", class: "control-label col-md-3"  %&gt;
  &lt;div class="col-md-4"&gt;
    &lt;%= f.select :Sector, options_for_select(@catgrupos.map{|e|[e.Descripcion, e.Clave]}) %&gt;
    &lt;button type="button" class="btn btn-default" data-toggle="modal" data-target="#mynewcategory"&gt;
      ...
    &lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This is my view index:</p>
  
  <pre><code>&lt;!-- Modal create action --&gt;
  &lt;%= form_for(@producto, remote: true, html: {class: "form-horizontal producto-validado"}) do |f| %&gt; &lt;!--ajax remote: true--&gt;
    &lt;div class="modal fade" id="mynewproducto" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"&gt;
      &lt;div class="modal-dialog" role="document"&gt;
        &lt;div class="modal-content"&gt;
          &lt;div class="modal-header"&gt;
            &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;&lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;&lt;/button&gt;
            &lt;h4 class="modal-title" id="myModalLabel"&gt;Agregar producto&lt;/h4&gt;
          &lt;/div&gt;
          &lt;div class="modal-body"&gt;
  
            &lt;div class="form-group"&gt;
  
              &lt;%= f.label :Clave, "Clave:", class: "control-label col-md-3"  %&gt;
              &lt;div class="col-md-7"&gt;
                &lt;%= f.text_field :Clave, class: "form-control producto_clave",autofocus: true, minlength: "1", required: "true"   %&gt;
              &lt;/div&gt;
  
            &lt;/div&gt;
  
            &lt;div class="form-group"&gt;
  
                &lt;div id="sector"&gt;&lt;%= render 'sector', f: f  %&gt;&lt;/div&gt;&lt;!--f:f es para que el parcial funcione con el formulario--&gt;
  
              &lt;%= f.label :Granel, "granel:", class: "control-label col-md-2"  %&gt;
              &lt;div class="col-md-1"&gt;
                &lt;%= f.check_box :Granel, class:"producto_granel" %&gt;
              &lt;/div&gt;
            &lt;/div&gt;
  
  
          &lt;/div&gt;
  
          &lt;div class="modal-footer"&gt;
            &lt;button type="button" class="btn btn-default" data-dismiss="modal" id="mynewproductoclose"&gt;Cerrar&lt;/button&gt;
            &lt;%= submit_tag "Crear", class: "btn btn-primary", data: { disable_with: 'Creando' }%&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;%end%&gt;
  &lt;/div&gt;
  
  
  &lt;!-- Modal create action --&gt;
  &lt;%= form_for(@catgrupo, remote: true, html: {class: "form-horizontal "}) do |c| %&gt; &lt;!--ajax remote: true--&gt;
    &lt;div class="modal fade" id="mynewcategory" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"&gt;
      &lt;div class="modal-dialog" role="document"&gt;
        &lt;div class="modal-content"&gt;
          &lt;div class="modal-header"&gt;
            &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;&lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;&lt;/button&gt;
            &lt;h4 class="modal-title" id="myModalLabel"&gt;Agregar categoria&lt;/h4&gt;
          &lt;/div&gt;
          &lt;div class="modal-body"&gt;
  
            &lt;div class="form-group"&gt;
  
              &lt;%= c.label :Clave, "Clave:", class: "control-label col-md-3"  %&gt;
              &lt;div class="col-md-7"&gt;
                &lt;%= c.text_field :Clave, class: "form-control catgrupo_clave",autofocus: true, minlength: "1", required: "true"   %&gt;
              &lt;/div&gt;
  
            &lt;/div&gt;
  
            &lt;div class="form-group"&gt;
              &lt;%= c.label :Descripcion, "Descripcion:", class: "control-label col-md-3"  %&gt;
              &lt;div class="col-md-9"&gt;
                &lt;%= c.text_field :Descripcion, class: "form-control catgrupo_descripcion", minlength: "3", required: "true"   %&gt;
              &lt;/div&gt;
            &lt;/div&gt;
  
  
  
            &lt;div class="form-group"&gt;
              &lt;%= c.label :Status,"Activo:", class: "control-label col-xs-7 col-sm-6 col-md-2"%&gt;
              &lt;div class="col-md-1"&gt;
                &lt;%= c.check_box :Status,{checked: true} %&gt;
              &lt;/div&gt;
            &lt;/div&gt;
              &lt;%= c.hidden_field :IdEmpresa, value: current_usuario.empresa_id %&gt;
              &lt;%= c.hidden_field :TipoGrupo, value: "P" %&gt;
          &lt;/div&gt;
  
          &lt;div class="modal-footer"&gt;
            &lt;button type="button" class="btn btn-default" data-dismiss="modal" id="mynewcategoryclose"&gt;Cerrar&lt;/button&gt;
            &lt;%= c.submit "Crear", class: "btn btn-primary", data: { disable_with: 'Creando' }%&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;%end%&gt;
  </code></pre>
  
  <p>and my create.js.erb in charge of rendering the partial</p>
  
  <pre><code>$(".catgrupo_clave").val('');
  $(".catgrupo_descripcion").val('');
  
  $("#sector").html("&lt;%= escape_javascript(render("productos/sector"), :locals =&gt; {:f =&gt; f})%&gt;")
  </code></pre>