Возможно ли подгрузить контент при помощи AJAX?

Question

[Павел Антонов]

Вывожу на сайт последние записи из группы в ВК таким вот способом:

<?php
  $wall = file_get_contents("http://api.vk.com/method/wall.get?v=5.52&filter=others&domain=***&count=10");
  $wall = json_decode($wall);
  $wall = $wall->response->items;

  for ($i = 0; $i < count($wall); $i++) {
    $user = file_get_contents("http://api.vk.com/method/users.get?v=5.52&user_ids=".$wall[$i]->from_id."&fields=photo_100");
    $user = json_decode($user);
    $user = $user->response;
	echo "<img src='".$user[0]->photo_100."' />".$user[0]->first_name." ".$user[0]->last_name;
    echo "<p><b>".($i + 1)."</b>. <i>".$wall[$i]->text."</i><br /><span>".date("Y-m-d H:i:s", $wall[$i]->date)."</span></p>";
  }
?>

Я вообще не особо понимаю в php, js, ajax всё на уровне гуглокода. Собственно вопрос возник такой, возможно ли добавить кнопку "Больше записей" и при клике на нее без перезагрузки страницы получать еще 10 записей со сдвигом (offset=10 есть такая опция в ВК API) и добавлять эти записи в нужное место (ну скажем просто ниже, под теми, что уже выведены)?

Что-то гугление не помогает, т.к я не могу сформулировать вопрос грамотно, либо возможно мой способ получения данных вовсе некорректный, я видел что некоторые получают записи без php а при помощи js.

Буду признателен если ткнете в ту сторону куда копать, спасибо.

Answer 1

[Павел Антонов]

Спасибо Ingush Archakov сделал вот так, пока все работает как нужно, единственное мне нужно в конце скрипта делать не offset++ а прибавлять каждый клик на 10, я не знаю языка, не могу понять как это корректно делается)

var offset = 0;
    $(document).ready(function(){
      $('a.test').click(function(){
        $.ajax({
          url: "test.php",
          method: "GET",
          cache: false,
          data:"offset=" + offset,
          success:function(data){
                console.log(data); 
                $("body").append(data);
              }
            })
        offset++;
        console.log(offset);
      });
    });

Итак публикую решение своего вопроса, еще раз спасибо за наведение в нужную сторону.
JS

var offset = 10;
    $(document).ready(function(){
      $('a.test').click(function(){
        $.ajax({
          url: "test.php",
          method: "GET",
          cache: false,
          data:"offset=" + offset,
          success:function(data){
                console.log(data); 
                $("body").append(data);
              }
            })
        offset = offset + 10;
        console.log(offset);
      });
    });

PHP

<?php
  $wall = file_get_contents("http://api.vk.com/method/wall.get?v=5.52&filter=others&domain=****&count=10&offset=".$_GET["offset"]);
  $wall = json_decode($wall);
  $wall = $wall->response->items;

  for ($i = 0; $i < count($wall); $i++) {
    $user = file_get_contents("http://api.vk.com/method/users.get?v=5.52&user_ids=".$wall[$i]->from_id."&fields=photo_100");
    $user = json_decode($user);
    $user = $user->response;
	echo "<img src='".$user[0]->photo_100."' />".$user[0]->first_name." ".$user[0]->last_name;
    echo "<p><b>".($i + 1)."</b>. <i>".$wall[$i]->text."</i><br /><span>".date("Y-m-d H:i:s", $wall[$i]->date)."</span></p>";
?>

Comments

[Archakov Dennis]

Конечно, рад помочь) Что значит "прибавлять каждый клик" ? То есть каждый раз при клике, прибавлять количество записей +N ? К примеру выводить каждый раз по 10 записей, да?

[Павел Антонов]

Ingush Archakov: да, уже разобрался сделал просто в конце скрипта своего вместо offset++ вот так offset = offset +10 все работает как надо, теперь выводится 10 записей изначально, а при клике на кнопку добавляются еще 10 со сдвигом 10, при втором клике еще 10 со сдвигом в 20

[Archakov Dennis]

freislot: отлично, но лучше offset += 10;

[Павел Антонов]

Спасибо, а в чем разница offset += 10; и offset = offset + 10; я просто совсем не кодер) обычный верстак, и пока все это дело изучаю и пробую всякие костыли писать

Answer 2

[Archakov Dennis]

Можно и очень просто. Используя в запросе offset и count, посылай через AJAX эти параметры.

Изначально используй переменную в которой хранится A строк и B смещение. И когда придет запрос на твой скрипт, получай через $_GET параметры и вставляй в эти переменные.

А в JS при каждом вызове, прибавляй +N раз (n - кол-во новых записей).