Question

我实施了一个select2 multiselect来在众多能力之间进行选择。能力有两种略有不同的估值。

让我们说“编程”，“一般问题解决”和“速度”使用Scale1;和“智能”，“改变支持”和“成本分析”使用Scale2。我希望我的select2首先显示所有6个选项，但是一旦我选择了其中一个选项，只允许进一步选择使用相同估值范围的权限。

我怎样才能做到这一点？

Answer 1

以下是我的解决方法。

我的select2在带有选项的现有选择中初始化。首先，我在选项中添加了一个新属性，表示我想要过滤的字符串（在我的例子中是＆＃39; scale＆＃39;，在我在评论中提供的示例中将是＆＃34; animalGroup＆＃34;。）

然后我在原始选择上设置了一个更改事件监听器：

select.on('change', function () {
        var currItems = $(this).val();

        $(this).find('option').prop('disabled', false);

        if (!(currItems == null || currItems === false)) {

            var currScale = $(this).find("option[value='" + currItems[0] + "']").attr('scale');

            $(this).find('option').prop('disabled', false);
            $(this).find("option[scale='" + currItems[0] + "']").prop('disabled', false);;


            $(this).parent().find('option').each(function () {
                if (($(this).attr('scale') != currScale)) $(this).prop('disabled', true);
            });


        }

        $(this).select2({
            allowClear: true,
        });
    });

In启用所有选项，然后，如果选择了至少一个选项，则禁用使用不同比例（或animalGroup）的所有选项。最后，重新初始化select2以捕获启用/禁用的更改。

select2多选过滤选项基于先前的选择

1 个答案: