Рейтинг@Mail.ru
 

Шаг 3

Меню навигации

Вот представьте, что у Вас в таблице несколько тысяч записей. Или еще больше. Если вывести все номера страниц в меню, то это самое меню займет львинную долю страницы. Чтобы этого избежать, нужно выводить текущий диапазон, как в Google допустим. Или еще красивее.

Сейчас этим и займемся. Для начала нужно добавить записей в таблицу, чтобы можно было это все увидеть наглядно. Для этого можно запустить такой скрипт:
1
 2
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
<?php


    
include './mysql.php';
    
     
$res mysqli_query($IRB_CONNECT"SELECT MAX(id) FROM `table`");
     
    
$row mysqli_fetch_row($res);
    
$i   $row[0];
    
    
$insert '';
    
    while(++
$i <= 10000)
    {
        
$insert .= "('', 'текст"$i ."'),";
        
       if(!(
$i 500))
       {
           
mysqli_query($IRB_CONNECT"INSERT INTO `table`
                        (`id`, `text`)
                        VALUES
                        "
trim($insert',')
                       );
                      
           
$insert '';    
        }
    }


Он заполнит таблицу 10 тысячами записей, и мы сможем убедиться (запустив тестовый скрипт), как ужасно смотрится меню навигации. Вот и начнем потихоньку приводить его в порядок.

Сначала генератор меню поместим в функцию. За одно выделим активную страницу:
1
 2
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
<?php


    
include './mysql.php';
    
// Количество строк на странице 
    
$num 10;
    
/**
* Generates the navigation menu     
* @param int $count, $page
* @return string
*/    
    
function createMenu($count$page)
    {   
        
$menu '';    
    
        for(
$i 1$i <= $count; ++$i)
        {
           if(
$i == $page)
               
$menu .= '<b>'$i .'</b> ';
           else
               
$menu .= '<a href="?page='$i .'">'$i .'</a> ';           
        }
           
        return 
$menu;    
    }

// Принимаем номер требуемой страницы      
    
$page = !empty($_GET['page']) ? (int)$_GET['page'] : 1;

// Считаем количество строк в таблице и делим на заданное. Получится количество страниц   
    
$res mysqli_query($IRB_CONNECT"SELECT COUNT(*) AS `cnt` FROM `table`"); 
    
$row mysqli_fetch_row($res);

    
$count = ($row[0] / $num);
    


// Формируем вывод 
     
$res mysqli_query($IRB_CONNECT"SELECT * FROM `table` LIMIT ". (($page 1) * $num) .", "$num);
     
    
$table "<table width=\"50%\" border=\"1\" cellspacing=\"0\" cellpadding=\"0\">\n";

    if(
mysqli_num_rows($res) > 0)        
        while(
$row mysqli_fetch_assoc($res))
        {
            
$table .= "<tr>\n<td>\n\t"$row['text']. "\n</td>\n</tr>\n";
        }
     
    
$table .= "</table>\n";    
    
    echo 
$table;
    echo 
createMenu($count$page);


Теперь видно, где мы находимся.
А сейчас начнем эту функцию модернизировать, чтобы она нам выдала красивую навигацию.
Перво-наперво определим диапазон, при котором ничего делать не нужно. Это будет от 1 до 12 страниц.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<?php

/**
* Generates the navigation menu     
* @param int $count, $page
* @return string
*/    
    
function createMenu($count$page)
    {   
        
$menu ''
        
        if(
$count <= 12)
        {          
            for(
$i 1$i <= $count; ++$i)
            {
               if(
$i == $page)
                   
$menu .= '<b>'$i .'</b> ';
               else
                   
$menu .= '<a href="?page='$i .'">'$i .'</a> ';           
            }

        }           
        return 
$menu;    
    } 


Если запустить скрипт с такой функцией, то меню исчезнет, так как страниц у нас гораздо больше, чем 12. По этому нужно вывести и этот диапазон. Обрежем слева и справа от текущей страницы по пять штук.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<?php

/**
* Generates the navigation menu     
* @param int $count, $page
* @return string
*/    
    
function createMenu($count$page)
    {   
        
$menu ''
        
// Если страниц меньше 13, оставляем все по дефолту.
        
if($count 13)
        {          
            
$i 1;    
            
$cnt $count;            
        }
        else
        {
            
            if(
$page 6)
            {  
// Если текущая страница в диапазоне от 1 до 5, выводим первые 10 ссылок
                
$i 1;
                
$cnt 10;                
            }                
            elseif(
$page >= $count 5)
            {  
// Если текущая страница на границе диапазона, или вышла за неё, показываем 10 последних
                
$i $count 10
                
$cnt $count
            }
            else
            {  
// В ином случае показываем 11 страниц: текущую,  5 слева от неё и  5 справа.  
                
$i $page 5;
                
$cnt $count;                
            }

            
// 
Обрезаем меню                
            
if($count $i 10)
                
$cnt $i 10;
                                  
        }        

      
// Формируем меню       
        
while($i <= $cnt)
        {
            if(
$i == $page)
                
$menu .= '<b>'$i .'</b> ';
            else
                
$menu .= '<a href="?page='$i .'">'$i .'</a> ';
                   
             
$i++;           
        }        
                   
        return 
$menu;    
    }


Теперь у нас меню будет состоять из 11 ссылок. Текущая, пять вперед и пять назад. Вроде так ничего. Но все равно не то. А если нам захочется первую страницу посмотреть? Или последнюю? Придется три дня сидеть, листать. Негоже. Нужно вывести их обязательно. А лучше по две с обоих сторон. А за одно сделаем шагалку. То есть ссылку, которая будет шагать сразу на 10 страниц вперед или назад.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<?php

/**
* Generates the navigation menu     
* @param int $count, $page
* @return string
*/    
    
function createMenu($count$page)
    {   
        
$menu ''
        
// Если страниц меньше 13, оставляем все по дефолту.
        
if($count 13)
        {          
            
$i 1;    
            
$cnt $count;            
        }
        else
        {

       
// Стрелочка на 10 влево
            
if($page 10)
                
$menu .= '<a href="?page='. ($page 10) .'">-10&lt;</a> ';

       
// Добавляем ссылки на две первые страницы         
            
if($count 12)
            {    
                if(
$page == 7)
                    
$menu .= '<a href="?page=1">1</a> '
                elseif(
$page == 8)        
                    
$menu .= '<a href="?page=1">1</a> <a href="?page=2">2</a> ';                                      
                elseif(
$page 7)        
                    
$menu .= '<a href="?page=1">1</a> <a href="?page=2">2</a> <b>...</b> ';
            }    


            if(
$page 6)
            {  
// Если текущая страница в диапазоне от 1 до 5, выводим первые 10 записей
                
$i 1;
                
$cnt 10;                
            }                
            elseif(
$page >= $count 5)
            {  
// Если текущая страница на границе диапазона, или вышла за неё, показываем 10 последних
                
$i $count 10
                
$cnt $count
            }
            else
            {  
// В ином случае показываем 11 страниц, 5 слева от текущей, 5 справа.  
                
$i $page 5;
                
$cnt $count;                
            }

            
// Обрезаем ссылки
            
if($page 6
                
$cnt $i 9;           
            elseif(
$count $i 10)
                
$cnt $i 10;
           
        }        

      
// Формируем меню       
        
while($i <= $cnt)
        {
            if(
$i == $page)
                
$menu .= '<b>'$i .'</b> ';
            else
                
$menu .= '<a href="?page='$i .'">'$i .'</a> ';
                   
             
$i++;           
        }  

      
// Добавляем ссылки на две последние страницы         
        
if($count 12)
        {    
            if(
$page $count 6)
                
$menu .= ' <b>...</b> <a href="?page='. ($count 1) .'">'. ($count 1) .'</a> ';
                   
            if(
$page $count 5)        
                
$menu .= '<a href="?page='$count .'">'$count .'</a> ';
        }              
 
       
// Стрелочка на 10 вправо 
            
$end = ($page  10 $count)? $count $page 10;
                     
            if(
$page $count 5)
                
$menu .= ' <a href="?page='$end .'">&gt;+10</a>'
                                   
        return 
$menu;    
    }


Ну вот, меню навигации привели в порядок. Вернее его функционал. Внешний вид подрихтуем чуть позже.

А пока упакуем скрипт в класс, чтобы было удобно с ним работать.