Question

首先，对不起我的英语。我是巴西人，现在正在改善。

我想创建一个名为“collection_cascading_select”的帮助器标签。那个助手类似于“collection_select”，但他还有一个名为“source”的参数。 “source”是视图中的另一个集合。

在“源”中选择了其他选项，需要运行JavaScript函数来获取其值。然后填充同意该值的“collection_cascading_select”集合。

令人困惑！我在这个问题上待了一周，我的巴西兄弟也没有帮助我。

谢谢！

[编辑]

@Samo

我得到它的工作，但有一些变化。

var success = function(response) {

for (var item in response){

    var id = response[item].breed.id   <--------------------  
    var name = response[item].breed.name <-------------------  
    var option = $(document.createElement('option')).val(id).html(name)
    dependentDropDown.append(option)  
  }  
}

我不明白FOR IN是如何运作的。

Answer 1

你可能正在寻找这样的东西： Ruby on Rails Country/State Select Enigma

Answer 2

听起来您正在寻找的答案是自定义表单构建器。您可以创建表单构建器并从Rails表单构建器继承，然后将该表单构建器设置为整个应用程序的默认构建器。然后你可以定义一个名为dependent_dropdown或cascading_selection等的元素。这个元素可能会获取源下拉列表的id。你的助手会输出一个collection_select，但它也会输出一些JavaScript，当源下拉列表发生变化时，它会触发一个AJAX调用。

当然，你不必这样做。您可以只使用collection_select，将一些属性添加到源下拉列表（即:class => 'source_for_dependent', :dependent => some_id），然后在application.js中连接一些JavaScript，以查找具有source_for_dependent类的集合，以及何时onchange事件触发它从dependent属性中获取id并触发AJAX调用。

无论哪种方式，这里都是你的JavaScript（使用jQuery）的一个例子

$('select.source_for_dependent').change(function() {
  var id = // get the id of the dependent dropdown, perhaps by $(this).attr('dependent')
  var dependentDropDown = $('#' + id);
  dependentDropDown.empty();
  var success = function(response) {
    for (var item in response) {
      var option = $(document.createElement('option')).val(item.val).html(item.text);
      dependentDropDown.append(option);
    }
  }

  $.get('/some_controller/some_action/' + $(this).val(), success);
}

成功处理程序被传递到jQuery的get方法。它将JSON响应作为参数。我们遍历响应，对于每个项目，我们创建一个option，从项目中提取值和文本，然后将其附加到依赖的下拉列表。您的控制器可能如下所示：

def some_action
  @obj = SomeClass.find(params[:id])
  respond_to do |format|
    format.js { render :json => @obj }
  end
end

修改

您定位的控制器取决于您。假设Dropdown A以资源A为目标，而Dropdown B以资源B为目标。类型为A的对象应该具有B类型的对象列表。如果您要执行对象show的{{1}}操作，则对象A的{{1}}方法需要包含其as_json关联。 This article显示了此示例。

否则，您可以定位资源A的{{1}}操作。使B成为index的嵌套资源是一种简单的方法，可以关闭B的id来获取所有类型B的对象，这些对象具有指向的外键A。

使用UJS创建帮助器标记

2 个答案: