레일스 동적으로 콜렉션을 변경하는 방법 양식에서 선택

Question

나는 전화를 추적하는 Rails 3.2.14 앱이 있으며 각 호출에는 연관성이있는 시설 모델의 픽업 및 드롭 오프 기능이 있습니다.

호출 모델에는 호출이 들어오는 위치를 기반으로 영역을 선택하는 지역 모델 (휴스턴, 달라스, 오스틴 등)에 대한 연결이 있습니다.

내가 원하는 것은 특정 지역 (휴스턴)을 선택할 수 있으며 픽업 시설 컬렉션에서는 휴스턴 지역 시설 만 표시 할 수 있습니다.

는 내가 설정에 다음과 같은 시설과 지역 사이의 관계 필요할 것로 시작하는 있으리라 믿고있어 :

facility.rb을

attr_accessible :region_id 
belongs_to :region 

region.rb

has_many :facilities 

그런 다음 각 시설을 존경과 일치하는 region_id로 설정해야합니다. 지역 (예 : Houston, Dallas 등)이 적절하게 작동하도록합니다.

특정 지역을 선택하고 해당 지역의 시설 만 양식에 표시하는 방법이 확실하지 않습니다. 일부 jQuery/JS/Ajax를 사용하여이 작업을 수행 할 수는 있지만 작업을 수행하는 방법을 모를 것이라고 가정합니다. 여기

는 내 전화, 시설, 지역 모델은 현재 어떤 모습인지의 발췌 한 것입니다 :

call.rb

belongs_to :transferred_from, :foreign_key => :transfer_from_id, :class_name => 'Facility' 
belongs_to :transferred_to, :foreign_key => :transfer_to_id, :class_name => 'Facility' 
belongs_to :region 

facility.rb

has_many :calls_transferred_from, :foreign_key => :transfer_from_id, :class_name => 'Call' 
has_many :calls_transferred_to, :foreign_key => :transfer_to_id, :class_name => 'Call' 

region.rb

여기

has_many :calls 

같은 것을 내 전화 양식 부분 외모의 발췌 한 것입니다 :이 모든 혼란 또는 설명을 필요로하는 경우

_form.html.erb

<%= form_for(@call) do |f| %> 
    <%= f.label :region %> 
    <%= f.collection_select(:region_id, Region.all, :id, :area, {:include_blank => true}, {:class => 'select', required: true}) %> 
    <%= f.label :Transfer_From %> 
    <%= f.collection_select(:transfer_from_id, Facility.active.order("facility_name ASC"), :id, :facility_name, {:include_blank => true}, {:class => 'select'}) %> 
<%= f.button "Submit", class: 'btn btn-info btn-large', data: {disable_with: "<i class='icon-spinner'></i>Processing..."} %> 
<% end %> 

알려 주시기 바랍니다 . 요약하면 휴스턴 (Houston) 지역을 선택하고 해당 지역을 선택했을 때 휴스턴 지역에있는 시설 만 표시하려고합니다.

제공 할 수있는 도움말이나 정보를 미리 감사드립니다.

Answer 1

나는 다음과 함께 올 한 Railscasts 동적 선택 메뉴를 기반으로 :

calls.js.coffee

jQuery -> 
    facilities = $('#call_transfer_from_id').html() 

    $('#call_region_id').change -> 
    region = $('#call_region_id :selected').text() 
    options = $(facilities).filter("optgroup[label=#{region}]").html() 

    if options 
     $('#call_transfer_from_id').html(options) 
    else 
     $('#call_transfer_from_id').empty() 

_form.html.erb

<%= f.grouped_collection_select :transfer_from_id, Region.order(:area), :facilities, :area, :id, :facility_name, {include_blank: true}, class: 'select' %> 

위의 grouped_collection_select의 문제점은 호출하는 것입니다. facilities l 모든 설비가 ists이고, 나는 Facility.active (설비에 대해 작성한 유효 범위를 나열하기위한 범위)라고 불렀다. grouped_collection_select 내에서 이것을 어떻게 호출 할 수 있습니까?

지금까지 새로운 호출에서 영역을 선택할 수 있었지만 그 영역의 기능은 보낸 사람 필드에서만 나타납니다 (transfer_from_id가 호출 됨). 전화를 편집하고 시설을 변경하려고 할 때 나는 해당 지역의 시설이 아닌 지역별로 그룹화 된 시설의 전체 목록을 제시했습니다. 범위를 좁히려면 지역을 변경 한 다음 특정 지역의 시설을 원래대로 되돌려 야합니다.

나는 이것으로 진전을 이루고 있다고 생각하지만, 내가 원하는 방식대로 작동하지 않는다. 나는 더 이해하기 쉽고 더 명확한 대답에 정말로 열려 있습니다.

Answer 2

이와 같은 경우 일반적으로 클라이언트에 사전을로드하여 간단하게 유지합니다.

<script> 
    var facilitiesForRegion = {}; 
    <% Facility.all.each do |facility| %> 
    var region = facilitiesForRegion[<%= facility.region_id %>]; 
    var object = { id: <%= facility.id %>, name: '<%= facility.facility_name %>'}; 
    if (region) { 
     region.push(object); 
    } 
    else { 
     facilitiesForRegion[<%= facility.region_id %>] = [object]; 
    } 
    <% end %> 

    $("#call_region_id").on("change", function (e) { 
    var id = parseInt($(this).val()); 
    var facilities = facilitiesForRegion[id]; 
    $('#call_transfer_from_id').children().remove(); 
    for (var i = 0; i < facilities.length; i++) { 
     $('#call_transfer_from_id').push('<option value="'+ facilities[i].id +'">'+ facilities[i].name +'</option>'); 
    } 
    }); 
</script> 

조금 추한 :

그래서보기에, 당신은 이런 식으로 뭔가를 구축 할 수 있습니다.나는 그런 관점에서 데이터의 배열을 만드는 가장 큰 팬이 아니지만 작동하고 ajax 요청 대기를 피합니다.

드롭 다운의 ID를 다시 확인하십시오. 필드 이름과 for_for를 기반으로 추측하고있었습니다.