Toggle pagination on click

Hi all,
I want to create a button, which on click changes the pagination in my variable:

$pages = $site
    ->find('page')
    ->children()
    ->listed()
    ->when($filterBy, function($filterBy) {
            $filtered = $this->filterBy('category', $filterBy, ',');
            if ( $filterBy === 'newest' ) {
            $filtered = $filtered->sortBy('date', 'desc');
            }
         return $filtered;
     )
     ->paginate(10); 
     $pagination = $pages->pagination();

Currently I have a list of, let’s say, article teasers. The list would be pretty long, wouldn’t I paginate it.
I want to create a way for the user to see all the articles on the same page by clicking a button. ->paginate() should be set to 999 or so on click. I would then use CSS and JS to style the article teasers to be smaller squares so they fit on the screen better.

I’d appreciate some guidance. Thanks!

You could create a button which links to the same url with a parameter or query string, then in your controller fetch that parameter and set the paginate value to that parameter. That approach would require a page reload. The alternative would be an AJAX based solution but that would require some more coding.

I think an AJAX based solution is what I’d prefer.
I took a look at the “Load more with Ajax” article and figured that I’ll have to start by creating controllers. From what I’ve seen you can only create controllers for page templates, not for snippets, right?
Because I am actually working with a custom block and currently all it’s logic is in the snippet. I tried moving the logic into my plugin’s index.php and it won’t work.

Kirby::plugin('fluxino/custom-blocks', [
    'blueprints' => [
        'blocks/sectionlisting' => __DIR__ . '/blueprints/blocks/section-listing.yml',
        ...
    ],
    'snippets' => [
        'blocks/sectionlisting' => __DIR__ . '/snippets/blocks/section-listing.php',
        ...
    ],
    'controllers' => [
        'sectionlisting' => function ($site, $kirby) {

            if ($block->istype() == 'normal') {
                $filterBy = get('filter');

                $articles = $site
                ->find('articles')
                ->children()
                ->listed()
                ->when($filterBy, function($filterBy) {
                    $filtered = $this->filterBy('category', $filterBy, ',');
                    if ( $filterBy === 'newest' ) {
                    $filtered = $filtered->sortBy('date', 'desc');
                    }
                    return $filtered;
                })
                ->paginate(10); 
                $pagination = $articles->pagination();
            }
            if ($block->istype() == 'nature') {
                $filterBy = get('filter');

                $articles = $site
                ->find('articles')
                ->children()
                ->listed()
                ->filterBy('category', 'nature', ',')
                ->paginate(10); 
                $pagination = $articles->pagination();
            }
            // more if's
        }
    ],
]);

It says Block error: "Undefined variable $filterBy" in block type: "sectionlisting".

That’s right, controllers are loaded for templates, not snippets.

And in your controller, $block is not defined.

But you don’t necessarily need a controller to load stuff with ajax.