Question

Select2允许通过应用某些样式和功能来改进标准<select>。我必须显示Select2样式的下拉列表，自定义绑定与Knockout。

这是一个电话号码列表，用户可以添加一些条目。 我希望它可以编辑。

用户应该能够选择一个条目或键入一个可以在应用程序中使用的新条目（与manager.selectedPhoneNumber绑定）

所以，在HTML中：

<body>
<select id="list" data-bind="
    options: manager.getMyPhoneNumbers(),
    optionsValue: 'id',
    optionsText: 'text',
    customBinding_phoneNumbersEditableList: manager.selectedPhoneNumber
    ">
</select>
</body>

在Javascript中：

ko.bindingHandlers.customBinding_phoneNumbersEditableList = {
            init: function (element, valueAccessor, allBindings, viewModel, bindingContext) {
                // initialize select2 with binded element
                $(element).select2({
                    //createSearchChoice: function (term, data) {
                    //    if ($(data).filter(function () {
                    //        return this.text.localeCompare(term) === 0;
                    //    }).length === 0) {
                    //        return {
                    //            id: term,
                    //            text: term
                    //        };
                    //    }
                    //},
                    formatResult: function (item) {
                        return buildSomePrettyString();
                    },
                    formatSelection: function (item) {
                        return buildSomePrettyString();
                    },
                    sortResults: function (results, container, query) {
                        return results;
                    }
                });
            },
            update: function (element, valueAccessor, allBindings, viewModel, bindingContext) { }
        };

取消注释函数createSearchCoice不起作用。它会导致异常Error: Option 'createSearchChoice' is not allowed for Select2 when attached to a <select> element.

有人可以帮助我吗？

允许用户使用Select2和Knockout在选择中自定义所选值

0 个答案: