Как использовать библиотеку paginator для загрузки страниц, эхо из PHP?

Question

Я разрабатываю проект, в котором я эхо-данные из базы данных в таблицу. Я хочу разбивать данные на клиентском сайте. Поэтому я использую самозагрузки библиотеку Paginator: http://lyonlai.github.io/bootstrap-paginator/

Вот мой код:

В моем заголовке:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
    <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script> 
    <script src="/js/bootstrap-paginator.min.js"></script> 
        <script type='text/javascript'> 
     var options = { 
      currentPage: 3, 
      totalPages: 10 
     } 

     $('#messages-pag').bootstrapPaginator(options); 
    </script> 

И в моем теле страницы:

<?php $messages = process_api_get($base_url,'/messages'); ?> 
    <?php if($messages) { ?> 
<?php foreach($messages as $message) : ?> 
    <div id="messages-pag"> 

<tr> 
<td> 
<?php echo get_username_by_id($message->to_user_id); ?> 
</td> 
<td> 
<?php echo get_username_by_id($message->from_user_id); ?> 
</td> 
<td> 
<?php echo $message->datetime; ?> 
</td> 
<td><a class="btn btn-sm btn-default " data-toggle="modal" data-target="#view_message_<?php echo $message->id; ?>"> View</a></td> 
<td><a class="btn btn-sm btn-default " data-toggle="modal" data-target="#edit_message_<?php echo $message->id; ?>"> Edit</a></td> 
<td><a href="<?php echo url('functions.php?action=delete_message&id=' . $message->id); ?>" class="btn btn-sm btn-default confirm-click"> Delete</a></td> 

</tr> 
                            </div> 
<?php endforeach; ?> 
                            <?php } ?> 

Но этот код вообще не влияет на разбиение на страницы. Кто-нибудь знает, почему?

Answer 1

Как сказал Марк, вам, скорее всего, понадобится подготовить свой скрипт, чтобы он применил JS после полной загрузки HTML. Но также похоже, что вы подключили библиотеку JS к КАЖДОМУ сообщению. Я не смотрел документацию для BS-pag, но я предполагаю, что JS необходимо применить к родительскому элементу, чтобы он мог делать свою работу. Другими словами, переместите свой DIV за пределы вашего foreach. Мне также странно, что у вас есть таблицы/столбцы таблицы в элементе div, а не в таблице. Это может вызвать некоторые проблемы, если BS-pag ожидает таблицу.

Кроме того, вы можете посмотреть таблицы данных (datatables.net). Похоже, это может быть именно то, что вы ищете.