【问题标题】:Separator in typeahead menu?预输入菜单中的分隔符?
【发布时间】:2016-08-23 05:48:16
【问题描述】:

我不确定我们是否已经有了使用单个数据源在预先输入菜单中显示分隔符的方法。我尝试了多种组合,尝试四处寻找解决方案,但找不到任何解决方案。

更像是在下面的屏幕截图中,我将这些来自单一来源的数据作为:

['US: channel1', 'US: channel2', 'US: channel3', 'US: channel4', 'US: channel5', 'CA: channel1', 'CA: channel2']

在上面的数据中,我想在美国频道之后显示一个分隔符,然后显示 CA 频道选项。

如果需要显示分隔符,我可以将数据源更新为多维数组或任何其他自定义。或者,typeaheadjs 范围之外的任何其他方式。

请帮我找到一个可行的解决方案。

【问题讨论】:

    标签: typeahead.js


    【解决方案1】:

    我想,我会回答我的问题。原来如此。

    我插入了一个空白值,该值将被替换为分隔符。

    ['US: channel1', 'US: channel2', 'US: channel3', 'US: channel4', 'US: channel5', '', 'CA: channel1', 'CA: channel2']
    

    要插入空白数据,我们可能必须使用来自单个数据源的多维数组。

    而且,使用 typeaheadjs 的 typeahead:render 事件,我必须如下所示进行处理:

     $(input).bind('typeahead:render', function (e) {
         var currentInput = $(e.target),
             options;
    
        options = $(currentInput).closest('.column-filter').find('.tt-suggestion');
        $(options).each(function (index, element) {
            if (!$(element).text().trim().length) {
                $(element).replaceWith('<hr>');
            }
        });
    });
    

    jsfiddle link 有一个工作示例。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-12-20
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多