Question

Railscast 88 revised

The coffeescript in this railscast specifies the IDs of the html select option lists:

  states = $('#person_state_id').html()

However, I am using nested forms, which generate new form fields, and their IDs, dynamically. For instance:

book_extents_attributes_new_extents_extent_value_input

or

book_measurements_attributes_2_measure_type_input

How do I generate those IDs on the fly?

Answer 1

A kind fellow helped me out: here’s a solution.

#view partial for nested form fields, as per railscast.

= javascript_include_tag 'simple_tooltip'
.nested-fields
  = f.inputs :class => :data_table_format do
    = f.input :client_id,   :as => :hidden, :value => current_user.client_id
    = f.input :extent_value, :label => "Extent", :input_html => {:class => 'nested_narrow_input'}
    %li.select
      = f.collection_select :extent_type_id, ExtentUnit.order(:value), :id, :value, {include_blank: true}, {:class => 'nested_drop_down_one_of_two'}
    %li.select
      = f.grouped_collection_select :extent_unit_id, ExtentUnit.order(:value), :extent_types, :value, :id, :value, {include_blank: true}, {:class => 'nested_drop_down_two_of_two'}
    .links
      = link_to_remove_association image_tag("#{static_root}/cross.png", {:class => :cross}), f

#application.js or somewhere in the asset pipeline

    $(document).ready(function(){

        $(".nested_drop_down_two_of_two").each(function(i,v){
            $(this).attr("data-content",$(this).html());
        });
        $(".nested_drop_down_one_of_two").live("change", function() {

            selected_type = $(this).find("option:selected").text();
            var content = $($(this).parent("li.select").next().find(".nested_drop_down_two_of_two").attr("data-content")).filter("[label='"+selected_type+"']").html()
            $(this).parent("li").next().find(".nested_drop_down_two_of_two").html(content);
            return true;
        });

    });