根据以前的选择字段值筛选选择字段

问题描述:

我是RoR的新手,在应用程序中遇到问题。问题在于基于其上的其他选择字段过滤名为“解决方案”的选择字段。根据以前的选择字段值筛选选择字段

现在,该应用所做的是从BD中检索关于区域,区域,关联,解决方案的所有信息,并使用这些数据填充选择字段。但是用户想要的是,当用户选择区域,区域和关联时,只应该显示关于该区域在该区域关联的解决方案。

编辑:

我快到了!我在我的应用程序中做了很多更改。选择字段由控制器动作new和函数“populate_selects”填充,该函数由参数before_action :popula_selects, only: [:new, :edit]调用。一个新功能是为了创建通过AJAX调用和升级“解决方案”字段:

Atendments_Controller < ApplicationController 

before_action :populate_selects, only: [:new, :edit] 

def new 
    @atend = atendment.new 
end 

def update_solution #AJAX 
    @solutions = atendment.joins(:solution).where("atendment_area_id = ? and atendment_region_id = ? and atendment_assoc_id = ?", params[:atendment_area_id], params[:atendment_region_id], params[:atendment_assoc_id]) 
    respond_to do |format| 
    format.js 
    end 
end 

private 

def populate_selects 
    @atendment_area = atendmentArea.where(status: true, user_id: current_user.id) 
    @atendment_region = atendmentRegion.where(status: true, user_id: current_user.id) 
    @atendment_assoc = atendmentRegionAssoc.where(status: true, assoc_id: current_user.entidade_id).where(atendment_region_id: @atendment_region.map(&:atendment_region_id)) 
    @solutions = atendment.joins(:solution).where("atendment_area_id = ? and atendment_region_id = ? and atendment_assoc_id = ?", params[:atendment_area_id], params[:atendment_region_id], params[:atendment_region_assoc_id]) 

    end 
end 

下面,从视图中_form.html.erb代码:

<div class="atendment-form"> 
    <%= form_for :atendment, url: {action: "new"}, html: {method: "get"} do |f| %> 

    <div class="col-xs-6"> 
    <%= f.select :atendment_area_id, options_for_select(@atendment_area.collect { |c| [ c.atendment_area.name, c.id ] }, 1), {:prompt=>"Área"}, { :class => 'form-control', :required => true, id: 'atendment_atendment_area_id' } %> 
     </div> 
     <div class="col-xs-6"> 
      <%= f.select :atendment_region_id, options_for_select(@atendment_region.collect { |c| [ c.atendment_region.name, c.id ] }, 1), {:prompt=>"Região"}, { :class => 'form-control', :required => true, id: 'atendment_atendment_region_id' } %> 
     </div> 
     </div> 
    </div> 

    <div class="field"> 
     <%= f.select :atendment_assoc_id, options_for_select(@atendment_assoc.collect { |c| [ c.atendment_region.name, c.id ] }, 1), {:prompt=>"Associado"}, { :class => 'form-control', :required => true, id: 'atendment_atendment_assoc_id' } %> 
    </div> 
    <div class="field"> 
     <%= f.select :solution_id, options_for_select(@solutions.collect { |solution| [solution.name, solution.id] }, 0), {:prompt=>"Solução"}, { :class => 'form-control', :required => true, id: 'atendment_solution_id' } %> 
    </div> 
    </div> 

干线新功能:

resources :atendments do 
collection do 
    get :update_solution 
    end 
end 

AJAX功能,调用 “update_solution” 并重置解决方案字段的值(应用程序/资产/ JavaScript的/ atendment.js.coffee):

show_solutions = -> 

$.ajax 'update_solution', 
type: 'GET' 
dataType: 'script' 
data: { 
    atendment_area_id: $("#atendment_atendment_area_id").val() 
    atendment_region_id: $("#atendment_atendment_region_id").val() 
    atendment_assoc_id: $("#atendment_atendment_assoc_id").val() 
} 
error: (jqXHR, textStatus, errorThrown) -> 
    console.log("AJAX Error: #{textStatus}") 
success: (data, textStatus, jqXHR) -> 
    console.log("OK!") 

$(document).ready -> 

    $('#atendment_atendment_assoc_id').on 'change', -> 
    show_solutions() 

所以,我创建了一个.coffee文件渲染的部分,将返回一个新值“解决方案”领域“选项”标签 (应用程序/视图/ atendment/update_solution.coffee):

$("#atendment_solution_id").empty() 
    .append("<%= escape_javascript(render :partial => 'solution') %>") 

并且,最后但并非最不重要的,含部分的HTML代码以上(APP /视图/ atendments/_solution.html.erb)中提到的 “选项” 的标签:

<option value="<%= solution.id %>" selected="selected"><%= solution.nome %></option> 

对于任何原因,AJAX功能不会在控制台上打印任何内容(也不会出错ither成功),但它调用update_solution.coffee文件。问题是,由于错误(500内部服务器错误),它不会更新选项值。我不知道我做错了什么。如果有人能帮助我,我很感激。

我解决了这个用下面的代码:

资产/ JS/atendments.js
我改变了代码,因为最后一个有许多错误。

function getAssociated(){ 

    var aau_id = $("#atendment_area_user_id").val() 
    var aru_id = $("#atendment_region_user_id").val(); 

    $.getJSON("/controllers/atendments_controller/getAssociated/"+aru_id, 
    function (callback) { 
    if (callback != "error"){ 

     var assoc = document.getElementById("atendment_region_associated_id"); 

     while (assoc.firstChild) { 
     assoc.removeChild(assoc.firstChild); 
     } 

     var i = Object.keys(callback).length -1; 

     $("#atendment_region_associated_id").append("<option value=''>Associated</option>"); 

     while (i >= 0) { 
     $("#atendment_region_associated_id").append("<option value='"+callback[Object.keys(callback)[i]]+"'>"+Object.keys(callback)[i]+"</option>"); 
     i--; 
     } 
    } 
    }); 
    get_solution_type(); 
} 

function get_solution_type() { 

    var ara_id = $("#atendment_region_associated_id").val(); 

    $.getJSON("/controllers/atendments_controller/getSolution/"+ara_id, 
    function (callback) { 

    if (callback != "error"){ 

     var sol = document.getElementById("atendment_solution_id"); 
     while (sol.firstChild) { 
     sol.removeChild(sol.firstChild); 
     } 
     var i = Object.keys(callback).length-1; 
     while (i >= 0) { 
     $("#atendment_solution_id").append("<option value='"+callback[Object.keys(callback)[i]]+"'>"+Object.keys(callback)[i]+"</option>"); 
     i--; 
     } 
    } 
    }); 

    var aau_id = $("#atendment_area_user_id").val(); 

    $.getJSON("/controllers/atendments_controller/getType/"+aau_id, 
    function (callback) { 

    if (callback != "erro"){ 

     var type = document.getElementById("atendment_type_id"); 
     while (type.firstChild) { 
     type.removeChild(type.firstChild); 
     } 
     var i = 0; 
     while (i < (Object.keys(callback).length)) { 
     $("#atendment_type_id").append("<option value='"+callback[Object.keys(callback)[i]]+"'>"+Object.keys(callback)[i]+"</option>"); 
     i++; 
     } 
    } 
    }); 
} 

$.getJSON执行AJAX请求与响应JSON和更新选择字段的选项标签的控制器。

控制器/ atendments_controller
我只是从数据库取回数据并返回为JSON

def getAssociated 
    aru_id = params[:atendment_region_user_id] 
    aras = AtendmentRegionAssociated.where("SQL here") 

    if aras.present? 
    render :json => aras.to_json 
    else 
    render :json => "error".to_json 
    end 

end 

def getSolution 
    ara_id = params[:atendment_region_associated_id] 

    sol = Solution.where("SQL here") 

    if sol.present? 
    render :json => sol.to_json 
    else 
    render :json => "error".to_json 
    end 

end 

def getType 
    aau_id = params[:atendment_area_user_id] 
    type = AtendmentType.where("SQL here") 

    if type.present? 
    render :json => type.to_json 
    else 
    render :json => "error".to_json 
    end 

end 

更新routes,把JavaScript函数中选择字段onchange财产。现在一切工作正常:D

我会用JS做这件事,可以想想其他任何方式。

由onchange调用的函数,用于更改每个需要隐藏或显示的字段的显示属性。