Filtering by Tags and Date

The CMS Questions
1

Im making a page with filter using this post. So far it’s working super well, but I would like to filter using two parameters including a date.

How is kirby managing the get(‘filter’) parameter in order to generate ?filter=FILTER ?

The user is able to filter the page using normal tag filters (that are working well so far) and I would like to add the ability to filter by year. It’s working using checkboxes: if a checkbox is checked, then the tag is added to an array and used to filter a json file:
http://localhost:8000/fr/journal.json?filter=Paris

        <fieldset class="filters">
            <?php foreach ($articlesByYear as $year => $events) : ?>

                <input type="checkbox" id="<?= $year ?>" name="<?= $year ?>" />
                <label for="<?= $year ?>"> <?= $year ?> (<?= $page->children()->filter(fn ($page) => $page->date()->toDate('Y') === (string)$year)->count() ?>)</label>

            <?php endforeach ?>

            <!-- All (<?= $unfiltered->count() ?>) -->

            <?php foreach ($filters as $filter) : ?>

                <input type="checkbox" id="<?= $filter ?>" name="<?= $filter ?>" />
                <label for="<?= $filter ?>"> <?= $filter ?> (<?= $unfiltered->filterBy('tags', $filter, ',')->count() ?>)</label>

            <?php endforeach ?>
        </fieldset>

Now the request:

let tags = checkedValues.map(encodeURIComponent).join(",");

  // Si l'événement est déclenché par une case à cocher spécifique
  if (e.target) {
    var url = `${window.location.href.split("#")[0]}.json/?filter=${tags}`;
    console.log(url);
    var xhr = new XMLHttpRequest();
    xhr.open("POST", url, true);
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

    xhr.onreadystatechange = function () {
      if (xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {
        console.log(xhr.responseText);
        var response = JSON.parse(xhr.responseText);
        document.querySelector(".results").innerHTML = response.html;
      }
    };
    xhr.send("param=" + tags);
  }

The best way would be to include some kind of ?=date=${date} at the end in order to manage multiple filters.

Here is my controller

return function ($site) {

    $year     = date('Y');
    $query   = get('q');
    $results = $site->search($query, 'title|text');

    $filterBy = get('filter');
    $unfiltered = site()->find('journal')->children()->listed();
    $myProjects = $unfiltered
        ->when($filterBy, function ($filterBy) {
            return $this->filterBy('tags', $filterBy);
        });
    $filters = $unfiltered->pluck('tags', ',', true);
    return [
        'filterBy' => $filterBy,
        'unfiltered' => $unfiltered,
        'myProjects' => $myProjects,
        'filters' => $filters,

        'query'   => $query,
        'results' => $results,
    ];
};

How could I expend my filtering system so it also includes the date of my articles ?

2

You would have to attache an additional query string, I request with multiple url params looks like this:

https://mydomain/myPath/?xx=bla&y=blub&z=something
3

Yep, that’s what I started working in.
But now
http://localhost:8000/fr/journal?date=2023 Is working perfectly, even combined with &filter
But here, on the json file, the date filter doesn’t seem to be working… it returns me the whole file…
http://localhost:8000/fr/journal.json?date=2023

Edit: nevermind, forgot to update the template.json.php