List.JS - Filter with comma separated values

Question

I'm trying to create a dropdown to filter based on dates, but I would like to be able to comma separate the dates instead of initilizing each field as a separate filter, which would be slow when you account for hundreds of dates, and each list item having 30+ dates each.

I thought maybe list.js supports comma separated fields, but I can't find any obvious solution online.

Here is a simple codepen with the code working with a single field:

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

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

Instead of this: <span class="stat filter_dates">1999</span>

Is this possible? Or do I need to initiate each date as a separate filter?

Answer 1

I didn't get any answers and couldn't find an obvious soultion to this. So the final result uses this method (JS script inside a PHP file)

<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>