i working on little project people can send "product search messages" community. therefore, need select category , subcategory searched product belongs. select need 2 dropdown lists whereas second dropdown list changes dynamically dependent on first selection. guess thats easy task , feel being close solution. got 2 models (one category, 1 subcategories) have one-to-many relationship.
this code far:
my search_controller
def index @subcategory = subcategory.find_by("id = ?", params[:subcategory_id]) end def new @search = search.new @categories = category.all @subcategories = subcategory.where("category_id = ?", category.first.id) end def update_subcategories @subcategories = subcategory.where("category_id = ?", params[:category_id]) respond_to |format| format.js end end def create @search = current_user.searches.build(search_params) @categories = category.all if @search.save redirect_to searches_path else render 'new' end end private def search_params params.require(:search).permit(:title, :category_id, :subcategory_id) end
part of routes.rb
'searches/update_subcategories', as: 'update_subcategories' 'searches/new'
the view on searches/new page
<%= form_for(@search, method: :get ) |f| %> <%= f.text_area :title %> <%= f.select :category_id, options_for_select(@categories.collect { |category| [category.name.titleize, category.id] }, 1), {}, { id: 'categories_select' } %> <%= f.select :subcategory_id, options_for_select(@subcategories.collect { |subcategory| [subcategory.name.titleize, subcategory.id] }, 0), {}, { id: 'subcategories_select' } %> <%= f.submit "create" %> <% end %>
a partial: views/subcategory/
<option value="<%= subcategory.id %>"><%= subcategory.name.titleize %></option>
and app/assets/javascripts/search.js.coffee
$ -> $(document).on 'change', '#categories_select', (evt) -> $.ajax 'update_subcategories', type: 'get' datatype: 'script' data: { category_id: $("#categories_select option:selected").val() } error: (jqxhr, textstatus, errorthrown) -> console.log("ajax error: #{textstatus}") success: (data, textstatus, jqxhr) -> console.log("dynamic category select ok!")
and app/views/searches/update_subcategories.js.coffee:
$("#subcategories_select").empty() .append("<%= escape_javascript(render(:partial => @subcategories)) %>")
there no error second dropdown list not change. missing?
i found way on: https://kernelgarden.wordpress.com/2014/02/26/dynamic-select-boxes-in-rails-4/
i thankful help!