I have a programming in the version of jquery 1 * of paging that is working fine, only that the site is using jQuery 2 and as I am not very knowledgeable of this library version, I would like help getting it to work.
this is the load_mailbox.php
if($_POST['page'])
{
$page = $_POST['page'];
$cur_page = $page;
$page -= 1;
$per_page = 15;
$previous_btn = true;
$next_btn = true;
$start = $page * $per_page;
include"db.php";
$query_pag_data = "SELECT m.id as msgid, m.sender, m.receiver, m.added, m.msg, m.unread, m.poster, m.subject, u.id, u.username, u.class from messages as m LEFT JOIN users as u on m.sender = u.id WHERE m.receiver = 2 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=htmlentities($row['subject']);
if ($row['sender'] == 0){
$row['username'] = "SISTEMA";
}
$msg .= "<tr>
<td><input type=\"checkbox\" class=\"marcar cinput\" name=\"check\" id=\"check\" value\"".$row['msgid']."\" /></td>
<td class=\"mailbox-star\"><a href=\"#\"><i class=\"fa fa-star-o text-yellow favo\"></i></a></td>
<td class=\"mailbox-name\"><a href=\"read-mail.html\">".$row['username']." </a></td>
<td class=\"mailbox-subject\"><b>".$row['subject']." </b></td>
<td class=\"mailbox-date\">".$row['added']."</td>
</tr>";
}
$msg = "<div class=\"navmp\"><table class=\"table table-hover table-striped\"><tbody>" . $msg . "</tbody></table>"; // Content for Data
/* --------------------------------------------- */
$query_pag_num = "SELECT COUNT(*) AS count FROM messages WHERE receiver = 2";
$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);
/* ---------------Calculating the starting and endign values for the loop----------------------------------- */
if ($cur_page >= 7) {
$start_loop = $cur_page - 3;
if ($no_of_paginations > $cur_page + 3)
$end_loop = $cur_page + 3;
else if ($cur_page <= $no_of_paginations && $cur_page > $no_of_paginations - 6) {
$start_loop = $no_of_paginations - 6;
$end_loop = $no_of_paginations;
} else {
$end_loop = $no_of_paginations;
}
} else {
$start_loop = 1;
if ($no_of_paginations > 7)
$end_loop = 7;
else
$end_loop = $no_of_paginations;
}
/* ----------------------------------------------------------------------------------------------------------- */
// FOR ENABLING THE PREVIOUS BUTTON
if ($previous_btn && $cur_page > 1) {
$pre = $cur_page - 1;
$msg .= "<i p='$pre' class='active'><button class=\"btn btn-default btn-sm\"><i class=\"fa fa-chevron-left\"></i></button></i>";
} else if ($previous_btn) {
$msg .= "<button class=\"btn btn-default btn-sm\"><i class=\"fa fa-chevron-left\"></i></button>";
}
// TO ENABLE THE NEXT BUTTON
if ($next_btn && $cur_page < $no_of_paginations) {
$nex = $cur_page + 1;
$msg .= "<i p='$nex' class='active'><button class=\"btn btn-default btn-sm\"><i class=\"fa fa-chevron-right\"></i></button></i>";
} else if ($next_btn) {
$msg .= "<button class=\"btn btn-default btn-sm\"><i class=\"fa fa-chevron-right\"></i></button>";
}
$msg = $msg . "</div>"; // Content for pagination
echo $msg;
$total_string = "<span class='total' a='$no_of_paginations'><b>" . $cur_page . "</b> / <b>$no_of_paginations</b></span>";
echo "<div class=\"pull-right\"><div class=\"btn-group\">" . $total_string . "</div></div>";
}
This is the programming in jquery.min that I want to make work in jQuery-2.1.3.min.js
$(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: "apps/mailbox/load_mailbox.php",
data: {page: page},
success: function(msg)
{
$("#mp").ajaxComplete(function(event, request, settings)
{
loading_hide();
$("#mp").html(msg);
});
}
});
}
loadData(1); // For first time page load default results
$(document).on('click', '.navmp i.active', function(){
var page = $(this).attr('p');
loadData(page);
});
I use bootstrap, but I do not want to use datatables for customization.
Thanks in advance for any help.