casella a discesa annidata e casella di selezione multipla basata su ogni discesa nelle guide?

Question

Ho un requisito che è un po 'difficile con come iniziare e cerco aiuto. Ho tre tavoli e cioè articoli, categorie e materiali. Si consideri la tabella di abbigliamento contiene

Mens ----- indossare

----- bambini di usura

e ho una pagina per aggiungere l'abbigliamento e mentre l'aggiunta di abbigliamento ho bisogno di avere una goccia giù che dovrebbe elencare le categorie. Selezionando le categorie, i materiali appartenenti alla categoria selezionata dovrebbero apparire nella casella di selezione multipla dalla quale possiamo selezionare i vari materiali che devono essere salvati nella tabella.

E il menu a tendina per selezionare le categorie deve essere annidato in quanto possiamo anche selezionare più di una categoria e ogni volta che viene aggiunta una categoria, il menu a discesa a selezione multipla relativa a quella categoria deve essere visualizzato dopo l'elenco a discesa della categoria.

Si consideri la seguente immagine che spiega chiaramente

Come posso creare una tabella per salvare i valori che seleziono da queste tabelle?

Aggiornamento:

class Apparel < ActiveRecord::Base 
    has_and_belongs_to_many :categories 
end 

class Category < ActiveRecord::Base 
    has_and_belongs_to_many :apparels 
    has_and_belongs_to_many :materials 
end 

class Material < ActiveRecord::Base 
    has_and_belongs_to_many :categories 
end 

Quanto sopra sono i modelli e le associazioni tra quelli. Voglio visualizzare un menu a discesa e che dovrebbe contenere le categorie e più sopra questo menu a discesa quando selezionato la casella di selezione multipla dovrebbe essere visualizzata sotto ogni menu a discesa per selezionare i materiali da esso o dirmi se posso fare come tenere multi -Seleziona invece di scorrere verso il basso e su ogni selezione l'altra casella di selezione multipla deve essere popolata con i valori ad essa associati. L'immagine seguente spiegherà chiaramente

Answer 1

avrei bisogno di un po 'più di informazioni, in particolare alcuni esempi di codice per aiutare davvero. Tuttavia ecco alcune risorse per iniziare. Dopo aver scritto qualcosa, quindi si prega di tornare indietro e di I/altri può aiutare ulteriormente :)

• Railscasts #88 - Dynamic select menus (revised) - Questo Railscast spiega come realizzare un menu di selezione/discesa dinamica, fx cambiando i materiali quando si seleziona una categoria.
• Railscasts #196 - Nested model form (revised) - Questo railscast mostra come aggiungere dinamicamente record associati con accepts_nested_attributes_for. Questo non è necessariamente importante per te, ma ti aiuterà almeno a capire come creare un modulo multi record.

Aggiornamento: Come popolare dinamicamente un selezionato menu a discesa/

Ok, quindi ciò che si desidera è di avere un menu di selezione (chiamato anche menù a tendina) di abbigliamento, che si aggiorna ogni volta che si seleziona una categoria (in un menu di selezione multipla).Per questo si può utilizzare il metodo illustrato in Railscasts #88 - Dynamic select menus (revised), ma lasciatemi spiegare di più qui:

Prima vogliamo creare la vista:

<%= form_for @object do |f| %> # don't know what your form is for, but you can just change it accordantly 
    <%= f.collection_select(:category_ids, Category.all, :id, :name, {}, {:multiple => true, :id => 'category_select'}) 
    <%= f.grouped_collection_select :apparel_id, Category.all, :apparels, :name, :id, :name, {}, {:id => 'appare} %> 
<% end %> 

Poi si aggiungono alcuni javascript nella directory attivi:

jQuery -> 
    $('#apparel_select').hide() # hide the select menu 
    apparels = $('#apparel_select').html() # get all the apparels in groups (the option and optgroup tags) 

    $('#category_select').change -> # when selecting/deselecting a category, should we update the apparels select menu 
    categories = $('#sel9UX :selected').map -> # find the selected categories 
     $(this).text() 

    options = {} 
    $.each categories, (index, value) -> # find all the optgroups that should be shown 
     options[value] = $(apparels).filter("optgroup[label='#{value}']") 

    $('#apparel_select').html("") # empty the select menu 
    $.each options, (key, value) -> # add each category group we have selected 
     $('#apparel_select').append(value) 

    $('#apparel_select').show() # show the select menu again 

Questo è scritto in CoffeeScript con jQuery. Se non usi CoffeeScript, scrivi un commento e proverò a scriverlo nella normale sintassi javascript.