Показать сообщение отдельно
  #1 (permalink)  
Старый 05.02.2014, 17:27
Интересующийся
Отправить личное сообщение для werty1001 Посмотреть профиль Найти все сообщения от werty1001
 
Регистрация: 21.12.2012
Сообщений: 23

Json ответ в таблицу
Здравствуйте, знатоки помогите c такой задачей.

Есть таблица с 10 пользователями. По клику по кнопке навигации 1-2-3 и.т.д ajax отправляет id кнопки и сервер отдает в формате json данные страницы(page=id) 10 новых пользователей и их данные, которые и нужно поместить в таблицу.

Таблица
<table>
     <thead>
     <tr>
      <td>ID</td>
      <td>Контакты</td>
      <td>Логин</td>
     </tr>
     </thead>
     <tfoot>
      <tr>
      <td colspan="100%"> Навигация по страницам: 
        <a href="#" class="loadpeople" data-id="1">1</a>
        <a href="#" class="loadpeople" data-id="2">2</a>
        <a href="#" class="loadpeople" data-id="3">3</a>
      </td>
      </tr>
     </tfoot>
     <tbody id="peoplelist">
     <tr>
      <td>33</td>
      <td>234243@mail.ru</td>
      <td>werwerwer</td>
     </tr>
     <tr>
     ....
     </tr>
     </tbody>
    </table>


JSON ответ
{

"page=1":[          {
                          "id": "123",
                          "login": "wsdf1001",
                          "mail": "werty123@m11ail.ru"
                         },

                         {
                          "id": "124",
                          "login": "werty33333",
                          "mail": "werty13333@123mail.ru"
                         }


          ],

"page=2":[          {
                          "id": "2123",
                          "login": "wsdf1001",
                          "mail": "werdfs23@m11ail.ru"
                         },

                         {
                          "id": "2124",
                          "login": "wsdfty33333",
                          "mail": "wsdfy13333@123mail.ru"
                         }


          ]

}


AJAX
$('.loadpeople').click(function(){ 
      var id=$(this).data('id');

        $.ajax({
                    type: "POST",
		    url: "",
		    dataType: "json",
                    data: "page="+ id,
		    success: function(data, textStatus, xhr){$("#peoplelist").html("<tr><td>"+data.id+"</td><td>"+data.login+"</td><td>"+data.mail+"</td></td></tr>");}
		});
                return false;  
            });


Как правильно написать ajax запрос, чтобы в таблицу добавлялось столько строк сколько вернет сервер. Заранее спасибо за ответ.

Последний раз редактировалось werty1001, 05.02.2014 в 17:31.
Ответить с цитированием