I´m making a site for myself and I´ve been stuck with this issue. The site has several categories, for example geometry -> triangles. When I'm scrolling through articles and do not have a filtered category on yet, everything is ok. But when I filter categories and choose a specific one, for example triangles, all other articles that do not concern triangles get hidden. But that's not the issue. The problem is, if the articles for triangles where on the page 3 while the filter was off and you could see all the articles all together, then even after the filter is on the chosen category will be left on the page 3 and won't move to the first page. How do I fix this?
bodyOfmainPage.php
<main class="index-main">
<section class="articles">
<div class="article_content container container--pall">
<h1 class="heading">მთავარი გვერდი</h1>
<div class="article_grid">
<?php $idM=get_size(); ?>// number of articles
<?php for($id=$idM;$id>0;$id--): ?>
<?php $idN= get_num_size($id);?>
<div class="article_item" href="#" data-id ="<?= intval(($idM - $id)/4 + 1) ?>" data-category="<?= get_data_category($id) ?>">
<div class="article_image" style="background-image: url('<?= get_img_url($id) ?>')"> </div>
<div class="article-text">
<div class="article_date"><?= get_article_date($id) ?></div>
<div class="article_title"><?= get_article_title($id) ?></div>
<div class="article_description"><?= get_article_description($id) ?></div>
<div class="hashtag"><?= get_hashtag($id) ?></div>
<div class="butt">
<a class="AB" href="<?= get_article_link($id) ?>">
<button type="button" class="clickA" >გადასვლა</button></a>
</div>
</div>
</div>
<?php endfor; ?>
</div>
</div>
</section>
<div class="num">
<ul class="contentNum">
<li class="navigation" data-id ="1">1</li>
<li class="navigation" data-id ="2">2</li>
<li class="navigation" data-id ="3">3</li>
<li class="navigation" data-id ="4">4</li>
<li class="navigation" data-id ="5">5</li>
</ul>
</div>
</main>