Yapılacak işlem:
İki tane listemiz oldugunda 1.cisi değiştiğinde 2.cisinin değişmesi
Daha önce karsıma cıkan ve baya ugrastıran bır konuydu benim için, jqoery le sorunu çözebildim.
town ve country olarak iki modelim var, bunlar birbirine has_many ile bağlılar.
adres adındaki modelimin içinde town_id, country_id alanlarım
html:
<%=form_for Adres.new do |f|%>
<div class="field">
<%=f.label :town_id%><br/>
<%=f.collection_select :town_id, Town.order(:name),:id, :name, include_blank: true %><br/>
</div>
<div class="field">
<%=f.label :country_id%><br/>
<%=f.grouped_collection_select :country_id, Town.order(:name),:countries, :name, :id, :name ,include_blank: true %><br/>
</div>
<%end%>
javascipt:
<script type="text/javascript">
states=$('#adres_country_id').html();
console.log(states)
</script>
calıstırıp web server üzerinden consola bakalım:
Country alanına optgroup olarak getirdik fakat hala town alanı değiştiğinde country alanını değişmiyor. bunun için javascript kodumuza devam edelim
javascipt:
$(function(){
states=$('#adres_country_id').html();
$('#adres_town_id').change(function(){
country=$('#adres_town_id :selected').text()
if(country)
{
options=$(states).filter("optgroup[label="+country+"]").html()
if (options)
{$('#adres_country_id').html(options)}
else
{$('#adres_country_id').empty();}
}
else
{ $('#adres_country_id').empty();
}
});
});
şimdi çalıştırıp bakalım:
