javascript - 根据事件动态禁用动态生成的 jQuery select2 中的几个选项

Question

我一直在尝试根据在另一个 Select2 上选择的选项动态禁用动态生成的 jQuery Select2 中的几个选项。我已经尝试了一些建议，但没有成功。

这个( how to let jquery select2 disable one option dynamically? )是最接近的，但同样，就我而言，我还没有 <select>带有已写入的选项，但是即时生成的。

选项的值和文本是从表中提取的，并且会随着时间而变化，因此更喜欢实现当前的方式(而不是上面的链接中的方式)。如果这根本不可能，那么也许 {{templating}}也许是最后的手段。下面的示例代码，我还在此处放置了一个演示:http://jsfiddle.net/s_j_l/gqbzh5y0/23/

HTML:

User Roles:
<div id="userr"></div>
Quarters:
<div id="qtr"></div>

JS:

$("#userr").select2({
        data: _.map(userroles, function (json) {
            return {
                id: json.roleid,
                text: json.role
            }
        }),
        placeholder: 'Select User Role',
        allowClear: true,
        containerCssClass: 'select-block-level'
    }).on('change', function (e) {
        if (e.val == 'user') $("#qtr").find('option[value="2013Q4"]').attr('disabled', 'disabled');
    });

    $("#qtr").select2({
        data: _.map(quarters, function (json) {
            return {
                id: json.qid,
                text: json.quarter
            }
        }),
        placeholder: 'Select Quarters',
        allowClear: true,
        containerCssClass: 'select-block-level'
    }).on('change', function (e) {});
});

数据:

{"userroles":[{"roleid":"admin","role":"Admin"},{"roleid":"user","role":"User"},{"roleid":"audit","role":"Audit"},{"roleid":"client","role":"Client"}],"quarters":[{"qid":"2014Q3","quarter":"2014 Q3"},{"qid":"2014Q2","quarter":"2014 Q2"},{"qid":"2014Q1","quarter":"2014 Q1"},{"qid":"2013Q4","quarter":"2013 Q4"},{"qid":"2013Q3","quarter":"2013 Q3"},{"qid":"2013Q2","quarter":"2013 Q2"},{"qid":"2013Q1","quarter":"2013 Q1"},{"qid":"2012Q4","quarter":"2012 Q4"},{"qid":"2012Q3","quarter":"2012 Q3"},{"qid":"2012Q2","quarter":"2012 Q2"},{"qid":"2012Q1","quarter":"2012 Q1"}]}

Answer 1

好吧，我已经尝试过编写工作代码但失败了。

理论是，符合:

    if (e.val == 'user') $("#qtr").find('option[value="2013Q4"]').attr('disabled', 'disabled');

您可以不复制此数组，而是将其放入对象中，然后删除具有所需值的值。然后，完成后将其转回 json。

Adding/removing items from JSON data with JQuery