【问题标题】:List.JS - Filter with comma separated valuesList.JS - 使用逗号分隔值过滤
【发布时间】:2020-10-20 07:29:55
【问题描述】:

我正在尝试创建一个下拉列表以根据日期进行过滤,但我希望能够用逗号分隔日期而不是将每个字段初始化为单独的过滤器,当您考虑数百个日期时这会很慢,并且每个列表项都有 30 多个日期。

我想也许 list.js 支持逗号分隔的字段,但我在网上找不到任何明显的解决方案。

这是一个简单的代码笔,代码使用单个字段:

https://codepen.io/mauricekindermann/pen/QWyqzQL

这个:<span class="stat filter_dates">1999,2099,2199</span>

而不是这个:<span class="stat filter_dates">1999</span>

这可能吗?还是我需要将每个日期作为单独的过滤器启动?

【问题讨论】:

    标签: list.js


    【解决方案1】:

    我没有得到任何答案,也找不到明显的灵感。所以最终结果使用了这个方法(一个PHP文件里面的JS脚本)

    <script>
        var options = {
        valueNames: [ 
            'id',
            <?
            while($item= mysqli_fetch_array($query))
            {
            ?>
            'filter_<?=$item['id']?>',
            <?
            }
            ?>
        ]
    };
    
    $(document).ready(function()
    {    
        if($('#filter').length > 0)
        {
            $('#filter').change(function ()
            {
                var selection = this.value;
                <?
                $i=0;
                mysqli_data_seek($query, 0);
                while($item= mysqli_fetch_array($query))
                {
                    if($i==0){
                        $type='if';
                    } else {
                        $type='else if';
                    }
                    ?>
                    <?=$type?>(selection == '<?=$item['id']?>')
                    {
                        userList.filter(function (item) {
                            return (item.values().<?='filter_'.$item['id']?> == selection);
                        });
                    }
                    <?
                $i++;
                }
                if($i > 0){
                ?>
                    else {
                        userList.filter();
                    }
                <?
                }
                ?>
            });
        };
    });
    </script>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2021-11-19
      • 1970-01-01
      • 1970-01-01
      • 2015-01-06
      • 2021-09-27
      • 2014-02-18
      • 1970-01-01
      • 2022-01-25
      相关资源
      最近更新 更多