Suppose there is a database in which my articles are. On the main page when loading, 10 articles are displayed .. At the end of the page there is a button "load more", and now you need to load the following entries on the page without pressing the button, but at the same time it is necessary that the first 10 records remain ... Like the tape in VK, you grudge the news and when the other records quickly load down the rest of the records are automatically loaded but the previous ones do not disappear ... such an endless tape for myself .. I need the same thing only without autoloading, but to loading the next 10 Posts occurred by clicking on the button ... Who can give an example of how this works ...? I would be grateful for the sample code ...

  • What has been done? - Mrak
  • Well, you have a direct route to the AJAX request. onclick = "showMoreArticles()" button, onclick = "showMoreArticles()" . And write a function that will make an AJAX request for a server on which you are preparing to output html with 10 articles. That's all. And on succsess in the block with your articles add articles from the answer. - Klimenkomud
  • I also wonder how to prepare html in PHP for the release to Ajax? The rest is clear. - dpi
  • Here is the solution itself ... If someone else comes in handy> ajaxs.ru/lesson/ajax/… - Vadim

1 answer 1

Here is an example of Ajax

  $('#yourbutton').click(function(){ $.ajax({ url: 'item.php', dataType: "JSON", success(data){ var items=''; items='<div><h1>Привет я новая статья</h1><br><h2>я добавилась</h2>'; for(var item in data){ '<p>'+data[item]+'</p><br>'; } items+='</div>'; $('.moreitems').html(items); } }) }); 

Here is an example PHP

 $item=['Я первая статья','Я вторая статья','А я тут третъя','Ну и так далее']; echo json_encode($item);