1

我希望能够重置（即空值和设置占位符，如在“新”上）一个Select2下拉菜单。更准确地说，我有依赖下拉菜单，清除一个应该清除依赖下拉菜单。

例如，我可以有国家、地区和城市：清除国家应该清除地区和城市。

我尝试了几件事，但从未能够以编程方式触发清除。最明显的一个是，$('#my-select').empty()但占位符没有重新设置，并且选定的值仍然存在（即使它没有显示）。

使用$('#my-select').select2('data', {})(or $('#my-select').select2('data', null)) 不会产生预期的结果并出现错误：

错误：当附加到元素时，Select2 不允许使用选项“数据”。

有没有有效的解决方案？

4

2 回答 2

1

好...

这是一种方式，它正在研究一个最小的例子（见下文）。在此示例中，第二个选择不会在重置时恢复它的占位符（假设它几乎可以工作）。这意味着我正在处理的遗留代码在某个地方存在问题（鉴于错误，我猜 JSP 标记会生成一个<select>.

这个问题似乎不是我要找的地方。

所以这是解决方案（但不是我真正问题的解决方案）。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Select2 example</title>
    <link href="select2-release-3.2/select2.css" media="all" rel="stylesheet" type="text/css" />
</head>
<body>

    <fieldset>
        <legend>Example</legend>

        <label for="first-select">First</label>
        <input id="first-select" />

        <label for="second-select">Second (depends on first)</label>
        <input id="second-select" />

    </fieldset>

    <script src="jquery-1.9.1.min.js"></script>
    <script src="select2-release-3.2/select2.js"></script>

    <script type="text/javascript">
        $(function() {

            var secondData = [{id:0,text:'1'},{id:1,text:'2'},{id:2,text:'3'},{id:3,text:'4'}];

            $(document).ready(function() {
                // Init first dropdown.
                $('#first-select').select2({
                    allowClear: true, 
                    placeholder: 'Select a value',
                    data: [{id:0,text:'A'},{id:1,text:'B'},{id:2,text:'C'},{id:3,text:'D'},{id:4,text:'E'}]
                });

                // Init second dropdown.
                $('#second-select').select2({
                    allowClear: true, 
                    placeholder: 'Select a value',
                    data: {}
                });
            });

            $(document).on('change', '#first-select', function() {
                if ($(this).val() == "") {
                    // Clear second
                    $('#second-select').select2({
                        allowClear: true, 
                        placeholder: 'Select a value',
                        data: {}
                    });
                } else {
                    // Fill second
                    $('#second-select').select2({data: secondData});
                }
            });
        });
    </script>

</body>
</html>
于 2013-04-03T13:20:40.220 回答
1

在 Select2 v3.4.1 中，我从 UL 中删除了 Li 元素，但只删除了“select2-search-choice”标签：

$('.select2-search-choice').remove();
于 2013-07-19T13:05:24.097 回答