javascript - 通过 knockout 绑定(bind)禁用 select2 下拉菜单？

Question

我有一个 MVC Razor 项目，在我看来，我有一个带有 data-bind="disable: setRoot" 的 Html.TextBoxFor。此 input 由 Select2 jquery 插件使用。 我的问题是 disable 绑定(bind)无法正常工作。 这是我的代码:

<div class="control-label">Category</div>
                    <div class="input-group">
                        <div class="input-group-addon"><label><input data-bind="checked: setRoot" type="checkbox"> root</label>
                        </div>
                        @Html.TextBoxFor(m => m.Create.IdCategory, new { id = "QuickSearchMainCategory", data_bind = "disable: setRoot, value: model.Create.IdCategory", @class = "form-control" })
                    </div>

和我的js:

self.setRoot = ko.observable(true);

            self.beRoot = ko.computed(function() {
                if (self.setRoot() === true) {
                    self.model.IdCategory(self.model.IdRootCategory());

                } else {
                    self.model.IdCategory(null);
                }
            });

$("#QuickSearchMainCategory").select2({
                placeholder: "Category search",
                minimumInputLength: 3,
                width: 'resolve',
                ajax: {
                    url: urlQuickSearchCategory,
                    contentType: 'application/json',
                    dataType: 'json',
                    type: 'POST',
                    traditional: true,
                    quietMillis: 400,
                    data: function(term, page) {
                        var data = {
                            term: term
                        };
                        return data;
                    },
                    results: function(data, page) {
                        return { results: data };
                    }
                },
                dropdownCssClass: "bigdrop",
                formatResult: function(item) { return item.id + " - " + item.label; },
                formatSelection: function(item) { return item.id + " - " + item.label; },
                escapeMarkup: function(m) { return m; }
            });

如果我检查 html，禁用功能有效，但不适用于整个 select2 元素，而仅适用于 id QuickSearchMainCategory 的输入。 我需要做什么？

Answer 1

Select2 不适用于“禁用”绑定(bind)，因为您必须明确告诉 select2 使用其内置函数禁用自身。

您必须使用此功能来禁用/启用它:

$('#QuickSearchMainCategory').select2('disable');
$('#QuickSearchMainCategory').select2('enable');

您必须在 ko View 模型中执行此操作，因为仅设置禁用的 HTML 属性是不够的。