【问题标题】:Knockout v3, with Chosen Multiselect - Tagging淘汰赛 v3,带有选择的多选 - 标记
【发布时间】:2014-07-24 15:39:51
【问题描述】:

我已经开始扩展所选库,方法是创建一个即时标记功能,使用敲除 observables 来保存所选值,但是我遇到了几个问题。希望有人能提供一些帮助。

观察到的问题:
输入两个以上的标签会删除第一个条目后添加的任何项目,并将其替换为最后输入的标签。从标签列表中选择选项效果很好,但是输入新标签会强制执行与前面提到的相同的行为。

自定义 KO 绑定:

ko.bindingHandlers.chosenTagging = {
    init: function (element, valueAccessor, allBindings) {
        $(element).chosen({ width: '100%', disable_no_results: true, enable_custom_content: true, placeholder_text_multiple: 'Enter Tag(s)' });

        var valuesObservable = allBindings.get('selectedOptions');
        var updateList = function () {
            $(element).trigger('chosen:updated');
        }

        if (valuesObservable && typeof (valuesObservable.subscribe) == 'function') {
            valuesObservable.subscribe(updateList);
        }
    },
    update: function (element, valueAccessor, allBindings) {
        $(element).trigger('chosen:updated');
    }
};

JSFiddle:
http://jsfiddle.net/S3H2A/5/

注意:如果您在 fiddle 中对所选 JS 提供任何补充,请说明进行更改的行号。

在这里找到类似的帖子:Add values to a chosen multiselect

【问题讨论】:

    标签: jquery knockout.js twitter-bootstrap-3 jquery-chosen


    【解决方案1】:

    你有一个:

    $(element).trigger('chosen:updated');
    

    还有一个

    $(element).trigger('liszt:updated');
    

    我认为最后一个已从选择中删除,它是以前版本的语法。 (尽管这可能不是您问题的答案)

    另一个问题是ko.bindingHandlers.chosenTagging.update函数在调用时 绑定更改中的可观察对象,但没有 (chosenTagging: { })。

    至于你真正的问题,我认为如果没有options 绑定,selectedOptions 绑定就不能很好地工作。
    使用options 绑定可以正常工作:demo

    如果您想保留使用 enable_custom_content_mode 输入自定义输入的可能性,则必须找到解决方法。

    【讨论】:

    • 我相信在选择行为的新事件触发器中选择:更新,而 liszt:更新是一种较旧的方式。我已经更新了上面的代码以使用更新的事件。
    • 我还注意到提交第一个条目时更新没有触发。关于如何首先解决这个问题的任何想法?
    • enable_custom_content_mode 似乎有问题。如果添加options 绑定,it works fine。我需要调查更多
    • 我认为没有options绑定你真的不能使用selectedOptions binding,如果你真的需要这种模式,我们需要一个解决方法
    • 我之前有一些选项,但是,它并没有提供太大的区别。我将更新 JSFiddle 以暂时合并它。
    猜你喜欢
    • 2013-07-15
    • 2013-05-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-08-28
    • 1970-01-01
    • 2017-02-01
    相关资源
    最近更新 更多