Paginação com estilo usando jQuery 1.3.2.min.js, estilo facebook

Boa tarde senhor desenvolvedores, segue uma solução para você paginar os resultados de suas consultas, tanto para grid ou div’s, a solução foi baseada em pesquisas.

Vocês vão precisar fazer download da versão 1.3.2.min.js do jQuery

Segue o código da solução:

<script type=”text/javascript” src=”jquery-1.3.2.min.js”></script>

<script type=”text/javascript”>
$(function() {
$(‘.load_more’).live(“click”,function() {
var last_msg_id = $(this).attr(“id”);
if(last_msg_id!=’end’){
$.ajax({
type: “POST”,
url: “ListarMaisRegistros.php”,
data: “lastmsg=”+ last_msg_id,
beforeSend: function() {
$(‘a.load_more’).html(‘<img src=”loading.gif” />’);
},
success: function(html){
$(“#more”).remove();
$(“ol#updates”).append(html);
}
});
}
return false;
});
});
</script>

Agora a construção do arquivo em PHP da classe ListarMaisRegistros.php

<?php
session_start();
include(‘ConexaoBanco’);

if(isset($_POST[‘lastmsg’]) &&is_numeric($_POST[‘lastmsg’]))
{
$lastmsg=$_POST[‘lastmsg’];
$query=”select * from tb where id =11 and id>’$lastmsg’ order by id asc limit 50″;
$result = mysqli_query($dbc,$query);

while($row=mysqli_fetch_array($result,MYSQLI_ASSOC))
{
$msg_id=$row[‘id’];
$message=$row[‘Nome’];
?>

<div class=”link-list”>
<div class=”link-list-img”>

<img src=”
<?
if($row[“foto0″] != ”)
{
echo ‘../../images/’.$row[“id”].’/’.$row[“foto”];
}
else
{
echo ‘s_img.jpg’;
}
?>
” width=”400″ height=”184″ />
</div>

<div class=”link-list-content”>
<span class=”link-list-title”><?= utf8_decode($row[“Nome”]);?></span>
<?=substr(utf8_decode($row[“descricao”]),0,140).”.. “.”| Veja Mais |”;?> </div>
</div>
</a>

<?php } ?>

<?php if(mysqli_num_rows($result)==50){ ?>

<div id=”more”> <a id=”<?php echo $msg_id; ?>” class=”load_more” href=”#”>Mais Arquivos</a> </div>

<?php
}
else
{
echo ‘ <div id=”more”>
<a id=”end” class=”load_more” href=”#”>Não existem mais arquivos a serem listados </a> </div>’;
}
}
?>

Anúncios

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s