Нумерация страниц при помощи jQuery, Ajax, PHP и MySQL

Опубликовано: 10 Июнь 2011Автор ratemir

Недавно мне было необходимо осуществить нумерацию страниц при помощи Ajax, PHP и MySQL без перезагрузки страницы. На одном иностранном сайте я нашел простой и интересный способ реализации данной задумки. Сразу хочу предупредить что в тамошнем скрипте проблемы с кодировкой. По крайней мере у меня они возникли, поэтому кое где, кое что пришлось подправить. В конечом итоге получилось следующее.

Нумерация страниц при помощи jQuery, Ajax, PHP и MySQL

Во-первых создаем базу данных, например «database» и создаём там таблицу «messages» с двумя колонками, которые назовём msg_id и message.

CREATE TABLE messages
(
msg_id INT PRIMARY KEY AUTO_INCREMENT,
message VARCHAR(150)
);

Немного HTML кода.

<div id="loading"></div>
<div id="container">
</div>

В блок container будут выводиться данные списка и нумерация страниц(постраничная навигация) полученные, с помощью ajax, из файла обработчика load_data.php.
Далее идёт яваскрипт, который будет следить за выводом данных на экран монитора.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
        <script type="text/javascript">
            $(document).ready(function(){
                function loading_show(){
                    $('#loading').html("<img src='images/loading.gif'/>").fadeIn('fast');
                }
                function loading_hide(){
                    $('#loading').fadeOut('fast');
                }                
                function loadData(page){
                    loading_show();                    
                    $.ajax
                    ({
                        type: "POST",
                        url: "load_data.php",
                        data: "page="+page,
                        success: function(msg)
                        {
                            $("#container").ajaxComplete(function(event, request, settings)
                            {
                                loading_hide();
                                $("#container").html(msg);
                            });
                        }
                    });
                }
                loadData(1);  // For first time page load default results
                $('#container .pagination li.active').live('click',function(){
                    var page = $(this).attr('p');
                    loadData(page);
 
                });           
                $('#go_btn').live('click',function(){
                    var page = parseInt($('.goto').val());
                    var no_of_pages = parseInt($('.total').attr('a'));
                    if(page != 0 && page <= no_of_pages){
                        loadData(page);
                    }else{
                        alert('Enter a PAGE between 1 and '+no_of_pages);
                        $('.goto').val("").focus();
                        return false;
                    }
 
                });
            });
        </script>

Теперь важные моменты PHP кода нумерации из файла load_data.php

<?php
if($_POST['page'])
{
$page = $_POST['page'];
$cur_page = $page;
$page -= 1;
$per_page = 15; //Количество выводимых данных на одной странице
$previous_btn = true; //Чтобы убрать кнопку предыдущая страница укажите false
$next_btn = true; //Чтобы убрать кнопку следующая страница пропишите false
$first_btn = true; //Чтобы убрать кнопку первая страница замените true на false
$last_btn = true; //Чтобы убрать кнопку последняя страница пропишите false
$start = $page * $per_page;
include"db.php";
$query_pag_data = "SELECT msg_id,message from messages LIMIT $start, $per_page";
$result_pag_data = mysql_query($query_pag_data) or die('MySql Error' . mysql_error());
$msg = "";
while ($row = mysql_fetch_array($result_pag_data))
{
$htmlmsg=htmlspecialchars($row['message']); //Фильтруем HTML
$msg .= "<li><b>" . $row['msg_id'] . "</b> " . $htmlmsg . "</li>";
}
$msg = "<div class='data'><ul>" . $msg . "</ul></div>"; //Выводим значения базы данные на экран
/* -----Общее количество записей--- */
$query_pag_num = "SELECT COUNT(*) AS count FROM messages"; // Всего записей
$result_pag_num = mysql_query($query_pag_num);
$row = mysql_fetch_array($result_pag_num);
$count = $row['count'];
$no_of_paginations = ceil($count / $per_page);
/* -----Расчет начального и конечного значения цикла----- */
 
//Далее следует код, увидеть который можно, скачав пример скрипта
 
}
?>

Я не стал выкладывать скрипт полностью, так как это займёт много места, поэтому кому интересно, качайте и «ноги в руки».



Опубликовать в twitter.comПоделиться ВКонтактеПоделиться в FacebookПоделиться В Моем МиреОпубликовать в своем блоге livejournal.com
Если Вам понравилась статья, Вы можете получать новые материалы Ratemir.ru по: RSS или можете просто получать обновления блога на e-mail:

7 комментариев к “Нумерация страниц при помощи jQuery, Ajax, PHP и MySQL”

  • Тарас
    19 Ноябрь, 2011, 18:40

    Спасибо вам большое!!!!!!

  • Geleosan
    4 Февраль, 2012, 17:56

    Прошу прощения, что не по теме. Где-то в комментариях на другом блоге видел, вы сталкивались с похожей проблемой и возможно знаете, в чем может быть дело...

    Перенес сайт с одного хостинга на другой. В результате комментарии отображаются кракозябрами сразу после добавления. Стоит плагин AJAX комментариев, поэтому они добавляются без перезагрузки страницы. Так вот если перезагрузить страницу, то комментарии уже будут в нормальной кодировке.

  • ratemir
    5 Февраль, 2012, 20:52

    Обычно проблема решается добавлением строчек AddDefaultCharset utf-8 в файл htaccess. Если не помогает, попробуйте файлам скрипта поставить кодировку utf-8 (без BOM).

  • Geleosan
    5 Февраль, 2012, 21:23

    Спасибо! Первый вариант как раз помог.

  • Сергей
    7 Февраль, 2012, 21:52

    Здравствуйте.

    Скачал архив и залил файлы у себя на сайте. Попробовал открыть файл pagination.php. Все вроде нормально, но не отображаются нумерация страниц. Может нужно что-то поменять?

    Например в базе данных?

  • Аня
    29 Май, 2013, 0:14

    Куда вставляется?

  • Zis
    15 Июнь, 2013, 19:00

    Объясните мне куда тут надо прописывать адреса страниц, ну чтобы открывались...Я просто в этом дуб дубом...Насчёт всего остального я понял...

Оставить комментарий

Наверх