Question

我正在尝试使用jquery过滤Rails 4应用程序中另一个下拉列表中的一个下拉列表。截至目前，我有：

$(document).ready(function(){
    $('#task_id').change(function (){
        var subtasks = $('#subtask_id').html(); //works
        var tasks = $(this).find(:selected).text(); //works
        var options = $(subtasks).filter("optgroup[label ='#{task}']").html(); // returns undefined in console.log
        if(options != '')
            $('#subtask_id').html(options);
        else
            $('#subtask_id').empty();
    });
});

任务列表是常规collection_select，子任务列表是grouped_collection_select。两者都按预期工作。问题是，即使使用上面列出的代码，我也无法获得要为所选任务显示的正确子任务。

注意：我还尝试var tasks=$(this).find(:selected).val()返回正确的数字，但选项过滤仍无法正常工作。

Answer 1

尝试这样的事情（未经测试但应该有效）。

$(function () {
    var $parent = $('#task_id'),
        $child = $('#subtask_id'),
        $cloned = $child.clone().css('display', 'none');

    function getParentOption() {
        return $parent.find('option:selected');
    }

    function updateChildOptions($options) {
        $child.empty();
        $child.append($options);
    }

    $parent.change(function (e) {
        var $option = getParentOption();
        var label = $option.prop('value'); // could use $option.text() instead for your case
        var $options = $cloned.find('optgroup[label="' + label + '"]'); 
        updateChildOptions($options);
    });
});

使用jquery动态下拉过滤选项

1 个答案: