Pooojaaaa Pooojaaaa - 2 months ago 19
jQuery Question

Ajax Pagination not working properly

<?php include("config.php");
error_reporting(E_ALL); ini_set('display_errors', 1);
$results = mysqli_query($con,"SELECT COUNT(name) FROM user_tbl ");
$get_total_rows = mysqli_fetch_array($results); //total records
//break total records into pages
$pages = ceil($get_total_rows[0]/$item_per_page);
?>

<script type="text/javascript">
$(document).ready(function() {
$("#results").load("fetch_pages.php"); //initial page number to load
$(".pagination").bootpag({
total: <?php echo $pages; ?>,
page: 1,
maxVisible: 5
}).on("page", function(e, num){
e.preventDefault();
$("#results").prepend('<div class="loading-indication"><img src="ajax-loader.gif" /> Loading...</div>');
$("#results").load("fetch_pages.php", {'page':num});
});
});
</script>

<body>
<div id="serch">
<form method="post" enctype="multipart/form-data">
<label>SEARCH BY NAME:</label>
<input type="text" name="name" class="name" >
<input type="submit" name="submit" class="sbmtt" value="SEARCH" />
</form>
</div>
</table>
<div class="res">
<div class="navi">
<div id="results"></div>
<div class="pagination"></div>
</div>
</div>
</body>


fetch_pages.php:

<?php
include("config.php"); //include config file
if(isset($_POST["page"])) {
$page_number = filter_var($_POST["page"], FILTER_SANITIZE_NUMBER_INT, FILTER_FLAG_STRIP_HIGH);
if(!is_numeric($page_number)) {
//incase of invalid page number
die('Invalid page number!');
}
} else {
$page_number = 1;
}

//get current starting point of records
$position = (($page_number-1) * $item_per_page);

//Limit our results within a specified range.
$results = mysqli_query($con, "SELECT * FROM user_tbl WHERE name = 'aruna' ORDER BY id ASC LIMIT $position, $item_per_page");

//output results from database
echo '<ul class="page_result">';
while($row = mysqli_fetch_array($results)) {
echo 'Name: ' .$row['name'];
echo '<br /><br />Contact Number: ' .$row['cont'];
echo '<br /><br />Email ID: ' .$row['email'];
echo '<br /><br /><a href="viewdtl.php?id='.$row['id'].'" target="_blank">View details</a>';
echo "<br /><hr />";
}
echo '</ul>';
?>


Config.php:

<?php
$con = mysqli_connect("localhost","root","","mydb");
$item_per_page = 3;
// Check connection
if (mysqli_connect_errno()) {
echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
?>


My result

Here the result just shows in the div.. i want to fetch the result after the form get submitted .. i tried
if(isset($_POST['submit']))
but not working.. and the search should be done by fetching the name from the html form not the way i ve given in fetch_pages.php like 'aruna' .. it should get fetched by the form data like
$_POST['name']
.. i m really stuck here.. any help plzzz .. thanks in advance

Answer

You need to pass search form value. Below is the full updated code.

<?php include("config.php");
error_reporting(E_ALL); ini_set('display_errors', 1);
$name = "";
$where = "";
if(isset($_POST["name"])){
    $name = $_POST["name"];
    $where = " WHERE name = '".$name."' ";
}
$results = mysqli_query($con,"SELECT COUNT(name) FROM user_tbl $where");
$get_total_rows = mysqli_fetch_array($results); //total records
//break total records into pages
$pages = ceil($get_total_rows[0]/$item_per_page);   
?>

<script type="text/javascript">
$(document).ready(function() {
var name = '<?php echo $name; ?>';
$("#results").load("fetch_pages.php", {'name':name});  //initial page number to load
$(".pagination").bootpag({
   total: <?php echo $pages; ?>,
   page: 1,
   maxVisible: 5 
}).on("page", function(e, num){
    e.preventDefault();
    $("#results").prepend('<div class="loading-indication"><img src="ajax-loader.gif" /> Loading...</div>');
    $("#results").load("fetch_pages.php", {'page':num, 'name':name});
  });
});
</script>

<body>
<div id="serch">
<form method="post"  enctype="multipart/form-data">
<label>SEARCH BY NAME:</label>
<input type="text" name="name" class="name" value="<?php echo $name; ?>">
<input type="submit" name="submit" class="sbmtt" value="SEARCH" />
</form>
</div>
</table><div class="res">
<div class="navi">
<div id="results"></div>
<div class="pagination"></div>
</div> </div>
</body>

fetch_pages.php:

<?php
include("config.php"); //include config file
if(isset($_POST["page"])){
$page_number = filter_var($_POST["page"], FILTER_SANITIZE_NUMBER_INT, FILTER_FLAG_STRIP_HIGH);
if(!is_numeric($page_number)){die('Invalid page number!');} //incase of invalid page number
}else{
$page_number = 1;
}

//get current starting point of records
$position = (($page_number-1) * $item_per_page);

$name = "";
$where = "";
if(isset($_POST["name"])){
    $name = $_POST["name"];
    $where = " WHERE name = '".$name."' ";
}

//Limit our results within a specified range. 
$results = mysqli_query($con, "SELECT * FROM user_tbl $where ORDER BY id ASC LIMIT $position, $item_per_page");

//output results from database
echo '<ul class="page_result">';
while($row = mysqli_fetch_array($results))
{

echo 'Name: ' .$row['name'];
echo '<br /><br />Contact Number: ' .$row['cont'];
echo '<br /><br />Email ID: ' .$row['email'];
echo '<br /><br /><a href="viewdtl.php?id='.$row['id'].'" target="_blank">View details</a>';  
echo "<br /><hr />";

}
echo '</ul>';
?>

Hope it will help.