Bootstrap page pagination without reloading, how to do?

Question

css

Hello.
I made pagination for comments (located in the middle of the page) - everything works, but the problem is that when you go to the second page of comments, it reloads completely and goes up, to see the comments on the second page you need to scroll to the middle where they are. How to make sure that when you go to another page of comments, the entire page does not reload or reload but in the same place and remain centered?

Answer 1

I understand that at the layout level this is not the right solution, but have you heard anything about AJAX? Pagination at the Bootstrap level is something weird. It should have pagination buttons and elements.
Then there are two ways, or by the server, moreover, most web frameworks do everything themselves out of the box, then AJAX is not needed. To this, you can add some kind of anchor in the HTML, as already advised. And if the page is large and it is critical not to reload it, then JavaScript is needed, again, there are libraries that can do this and you just need to configure it. From simple, jQuery has this in jQuery UI I think.

Answer 2

Something happened to be done with this script. But for some reason it does not work in the Mozilla browser! In all other browsers, chrome, opera, ej, Yandex browser - everything works fine. What could be the problem with mozilla tell me pliz!
Link where you can see the transition to comments in browsers
odrova.sharelink.ru
Here is the script code

$(document).ready(function () {

       // Посилання з id="test" буде тригером події

       $(".comments-page").click(function() {
           event.preventDefault();
           var url = $(this).attr('href');

           // AJAX-запит на потрібну адресу

           $.get(url, function(data) {

               // Замінюємо текст тегу з id="target" на отримані дані

               $("#comments").html(data);

           });

       });

   });