Проблема с нумерацией страниц, нуждающаяся в помощи - PullRequest
Новая
       23

Проблема с нумерацией страниц, нуждающаяся в помощи

0 голосов
/ 09 февраля 2010

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

Первая главная страница выглядит следующим образом: pagination.php: 

<?php
include('config.php');
$per_page = 3;

//Calculating no of pages
$sql = "select * from explore";
$result = mysql_query($sql);
$count = mysql_num_rows($result);
$pages = ceil($count/$per_page)
?>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery_pagination.js"></script>

<style>
body { margin: 0; padding: 5; font-family:Verdana; font-size:10px }
a
{
text-decoration:none;
color:#B2b2b2;

}

a:hover
{

color:#DF3D82;
text-decoration:underline;

}
#loading { 
width: 100%; 
position: absolute;
}

#pagination
{
text-align:center;
margin-left:120px;

}
li{ 
list-style: none; 
float: left; 
margin-right: 16px; 
padding:5px; 
border:solid 1px #dddddd;
color:#0063DC; 
}
li:hover
{ 
color:#FF0084; 
cursor: pointer; 
}
td{
border:solid 1px #dddddd;
padding:5px;
}


</style>



<div id="loading" ></div>
<div id="content" ></div>
<ul id="pagination">
<?php
//Pagination Numbers
for($i=1; $i<=$pages; $i++)
{
echo '<li class="page_numbers" id="'.$i.'">'.$i.'</li>';
}
?>

<p id="marketing">MARKETING</p>
</ul>
<br />
<br />

Кнопка выше на этой странице выглядит следующим образомкак вы можете видеть: 

<p id="marketing">MARKETING</p>

Итак, когда пользователь нажимает эту кнопку, она мне нужна для получения результатов из базы данных.

Я делаю это с помощью jquery следующим образом: 

$(document).ready(function(){

    //Display Loading Image
    function Display_Load()
    {
        $("#loading").fadeIn(900,0);
        $("#loading").html("<img src='bigLoader.gif' />");
    }
    //Hide Loading Image
    function Hide_Load()
    {
        $("#loading").fadeOut('slow');
    };


   //Default Starting Page Results

    $("#pagination li:first").css({'color' : '#FF0084'}).css({'border' : 'none'});

    Display_Load();

    $("#content").load("pagination_data.php?page=1", Hide_Load());



    //Pagination Click
    $("#pagination li").click(function(){

        Display_Load();

        //CSS Styles
        $("#pagination li")
        .css({'border' : 'solid #dddddd 1px'})
        .css({'color' : '#0063DC'});

        $(this)
        .css({'color' : '#FF0084'})
        .css({'border' : 'none'});

        //Loading Data
        var pageNum = this.id;

        $("#content").load("pagination_data.php?page=" + pageNum, Hide_Load());

    });


// Editing below.        
        // Sort content Marketing    
        $("#pagination p").click(function () {


        Display_Load();

        //CSS Styles
        $("#pagination li")
        .css({'border' : 'solid #dddddd 1px'})
        .css({'color' : '#0063DC'});

        $(this)
        .css({'color' : '#FF0084'})
        .css({'border' : 'none'});

        //Loading Data
        var pageNum = this.id;

        $("#content").load("filter_marketing.php?page=" + pageNum, Hide_Load());
        });

});

Проблема в том, что не работает по одной основной причине: 1. PageNum = marketing.Мне нужно, чтобы цифры были такими же, как для «нумерации страниц» выше.Я не знаю, как это исправить правильно.

В случае, если я вас запутываю, я постараюсь объяснить лучше:

Я хочу создать кнопку (т.е. маркетинг), которую при нажатииполучит данные из базы данных и отобразит их, но мне также нужно «обновить» нумерацию страниц, чтобы компенсировать новые данные.

Если вам нужны дополнительные пояснения, пожалуйста, дайте мне знать.Любая помощь будет принята с благодарностью.Спасибо.

1 Ответ

0 голосов
/ 09 февраля 2010

Думаю, вы ищете index(). 

 var pageNum = $(this).index() + 1;

Имейте в виду, что индекс равен 0, следовательно, добавьте 1.

Это также будет зависеть от разметки html, потому что возвращается индекс:

целое число, указывающее положение первого элемента в объекте jQuery относительно его родственных элементов.

EDIT:

Так что, если при обновлении содержимого #content вы также изменяете атрибут страницы данных, вы также можете получить эту информацию при нажатии на #marketing, чтобы вы знали, какую страницу получить.

Это также сработало бы, если бы вы дали одному из элементов LI класс "current-page", а затем получили идентификатор LI .current-класса. 

<div id="content" data-page="1"></div>

Js: 

//Pagination Click
$("#pagination li").click(function(){
    //...
    $("#content").load("pagination_data.php?page=" + pageNum, function(){
          Hide_Load();
          $(this).attr('data-page', pageNum);
    });
});


$("#pagination p").click(function () {
    //...
    var pageNum = $('#content').attr('data-page');

    $("#content").load("filter_marketing.php?page=" + pageNum, Hide_Load());
 });
...