Load more causes error

hey there,

i’m trying to use the load more (https://getkirby.com/docs/cookbook/ajax-load-more) function for my blog articles.

the first problem i encounter is the following php error:
Undefined variable: limit
in this line:
<div class="articles" data-page="<?= $page->url() ?>" data-limit="<?= $limit ?>">

after replacing the $limit with 2 i encounter an other error which was already solved in the forum (Load More Ajax Problems) by switching to mamp – but i’m already using mamp and i can’t figure out my mistake. the console error:
GET http://localhost:8888/dustmann/news.json?limit=2&offset=2 404 (Not Found)

news.php:

    <main class="main <?= $page->template() ?>" role="main">
        <h1><?= $page->title() ?></h1>
        <div class="articles" data-page="<?= $page->url() ?>" data-limit="<?= $limit ?>">

            <?php foreach($page->children()->visible()->flip() as $article): ?>
                <?php snippet('article', compact('article')) ?>
            <?php endforeach ?>
        </div>
        <button class="load-more">More news</button>
    </main>

articles controler

    <?php
    return function($site, $pages, $page) {
      $articles = $page->children()->visible();
      $count    = $articles->count();
      // check if the request is an Ajax request and if the limit and offset keys are set
      if(r::ajax() && get('offset') && get('limit')) {
        // convert limit and offset values to integer
        $offset = intval(get('offset'));
        $limit  = intval(get('limit'));
        // limit articles using offset and limit values
        $articles = $articles->offset($offset)->limit($limit);
        // check if there are more articles left
        $more = $count > $offset + 1;
      // otherwise set the number of articles initially displayed
      } else {
        $offset   = 0;
        $limit    = 2;
        $articles = $articles->limit($limit);
      }
      return compact('offset', 'limit', 'articles', 'more');
    };

articles.json.php

        <?php
            $html = '';
            foreach($articles as $article) {
              // reuse the article snippet to create the HTML for each article
              // we need to set the third parameter to true, to return the
              // snippet content instead of echoing it
              $html .= snippet('article', compact('article'), true);
            }
            // add $html and $more to the $data array
            $data['html'] = $html;
            $data['more'] = $more;
            // JSON encode the $data array
            echo json_encode($data);

Looks like you are using a news.php template, but an articles.php controller, that would explain why the $limit variable is unknown to the template and the rest doesn’t work either.

i renamed the template to articles.php – which fixed the php error concerning the $limit viariable.

but the console still returns an error:
GET http://localhost:8888/dustmann/undefined.json?limit=NaN&offset=NaN 404 (Not Found)

the NaN means that there is stell an error with the $limit variable?

Could you post your javascript, please? Most likely, you are not grabbing the correct element…

1 Like

ahhh! thanks for the tip…
i was using the .articles twice.