How to make PHP Pagination is working in Mobile? - php

Question

I have implement pagination in PHP.
It's works fine on Desktop and Laptop but but its not working on mobile devices.
member_list.php
<?php
include "../connection.php";
extract($_REQUEST);
$perPage = 50; // total records per page
// page
$conditionArr = array(); // array for condition
$condition = ""; // conditions
$pages = ""; // how many pages created
$type = "";
$company = "";
$message = "";
$rersArr = array();
$data = array();
$templeArr = array();
if ($sabhasadnumber != "") {
array_push($conditionArr, "sabhasad_number = '" . $sabhasadnumber . "'");
}
if ($Sakhe != "") {
array_push($conditionArr, "sakhe_id = '" . $Sakhe . "'");
}
if ($g != "") {
array_push($conditionArr, "gender LIKE '%" . $g . "%'");
}
$sql = "SELECT * FROM members WHERE village_id = '$id' and is_active = '1' and status = '1' ";
if (sizeOf($conditionArr) > 0) {
$condition = implode(" AND ", $conditionArr);
// echo $condition;
$sql .= " AND $condition";
}
$start = ($page - 1) * $perPage;
$sql1 = mysqli_query($conn, $sql) or die(mysqli_error($conn));
$count = mysqli_num_rows($sql1);
$pages = ceil($count / $perPage);
$sql .= " ORDER BY members_id ASC";
$sql .= " limit $start,$perPage ";
$num_of_rows = mysqli_num_rows($sql1);
?>
<input type="hidden" name="total_page" id="total_page" value="<?php echo $pages; ?>">
<input type="hidden" name="current_page" class="current_page" id="current_page"
value="<?php echo $page; ?>">
<div class="member--items">
<div class="row gutter--15 AdjustRow">
<div class="row">
<?php
$result = mysqli_query($conn, $sql);
if (mysqli_num_rows($result) > 0) {
while ($row = mysqli_fetch_array($result)) {
?>
<div class="col-md-3 col-xs-6 col-xxs-12" style="height:300px">
<div class="member--item ">
<?php
$imgurl = "";
if ($row["image"] != "") {
$imgurl = "../admin/uploads/" . $row["image"];
} else {
$imgurl = "../admin/uploads/default_profile.jpg";
}
?>
<div class="img img-circle">
<a href="sabhasad_family.php?id=<?php echo $row['sabhasad_number']; ?>" class="btn-link">
<img src="<?php echo $imgurl; ?>" alt=""
style="height: 150px; width: 150px;">
<!-- <img src="../admin/uploads/default_profile.jpg" alt=""-->
<!-- style="height: 150px; width: 150px;">-->
</a>
</div>
<div class="name">
<h3 class="h fs--12">
<p>
<a href="sabhasad_family.php?id=<?php echo $row['sabhasad_number']; ?>"> <?php echo $row['surname'] ." " ;
echo $row['name'] ." ";
echo $row['middle_name'] ." "; ?></a></p>
</h3>
</div>
<div class="activity">
<p>સભાસદ નંબર : <?php echo $row['sabhasad_number']; ?> </p>
</div>
</div>
</div>
<?php
}
}
else { ?>
<?php
}
?>
member_list.js
var page = 1;
var total_page = "";
function getresult(searches) {
$.ajax({
url: "process/member_list.php",
type: "post",
data: {
sabhasadnumber: $("#sabhasadnumber").val(),
id: $("#village_id").val(),
Sakhe: $("#Sakhe").val(),
g: $("#g").val(),
page: page
},
success: function (data) {
// alert(data);
if (data != "") {
if (searches === true) {
$("#mlist").html(data);
} else {
$("#mlist").append(data);
}
}
}
});
}
$(document).ready(function () {
getresult(false);
$(window).scroll(function () {
if ($(window).scrollTop() >= $(document).height() - $(window).height()) {
if (parseInt($(".current_page:last").val()) < parseInt($("#total_page").val())) {
page = parseInt($(".current_page:last").val()) + 1;
// alert("scrool"+$(".current_page:last").val());
getresult(false);
}
}
});
$("#reset").click(function () {
$("#Sakhe").val("");
$("#sabhasadnumber").val("");
$("#g").val("");
page = 1;
getresult(true);
});
$("#shopsubmit").click(function () {
page = 1;
getresult(true);
});
$("#freset").click(function () {
$("#subcategory").val("");
page = 1;
getresult(true);
});
});
My front page code look like this
village.php
<?php
include 'connection.php';
include 'header.php';
$id = $_GET['id'];
$totalvillagemember = mysqli_num_rows(mysqli_query($conn, "select members_id from members WHERE village_id = $id AND is_active = '1' and status = '1' "));
$villagename = mysqli_query($conn, "SELECT name from village WHERE village_id = $id");
$row1 = mysqli_fetch_array($villagename);
?>
<body>
<!-- Preloader Start -->
<div id="preloader">
<div class="preloader--inner"></div>
</div>
<!-- Preloader End -->
<!-- Wrapper Start -->
<div class="wrapper">
<!-- Header Section Start -->
<!-- Header Section End -->
<!-- Page Header Start -->
<div class="page--header pt--60 pb--60 text-center" data-bg-img="img/page-header-img/bg.jpg" data-overlay="0.85">
<div class="container">
<div class="title">
<h2 class="h1 text-white">સભ્યો</h2>
</div>
<ul class="breadcrumb text-gray ff--primary">
<li>હોમ</li>
<li class="active"><span class="text-primary">સભ્યો</span></li>
</ul>
</div>
</div>
<!-- Page Header End -->
<!-- Page Wrapper Start -->
<section class="page--wrapper pt--80 pb--20">
<div class="container">
<div class="row">
<!-- Main Content Start -->
<div class="main--content col-md-8 pb--60" data-trigger="stickyScroll">
<div class="main--content-inner">
<!-- Filter Nav Start -->
<div class="filter--nav clearfix">
<div class="filter--link">
<h2 class="">ગામ : <?php echo $row1['name']; ?></h2>
<h2 class="">કુલ સભ્ય :<?php echo number_format($totalvillagemember) ?></h2>
</div>
</div>
<div id="mlist" name="mlist">
</div>
<!-- Page Count End -->
</div>
</div>
<!-- Main Content End -->
<!-- Main Sidebar Start -->
<div class="main--sidebar col-md-4 pb--60" data-trigger="stickyScroll">
<!-- Widget Start -->
<div class="widget">
<h2 class="h4 fw--700 widget--title">સભ્ય શોધો</h2>
<!-- Buddy Finder Widget Start -->
<div class="buddy-finder--widget">
<form name="village" id="village">
<div class="row">
<div class="col-xs-6 col-xxs-12">
<div class="form-group">
<label>
<span class="text-darker ff--primary fw--500">શોધી રહ્યો છુ</span>
<select class="form-control form-sm" name="g" id="g">
<option value=""> પસંદ કરો
</option>
<option value = "M">પુરુષ</option>
<option value = "F">સ્ત્રી</option>
</select>
</label>
</div>
</div>
<div class="col-xs-6 col-xxs-12">
<div class="form-group">
<label>
<span class="text-darker ff--primary fw--500">સભાસદ નંબર</span>
<input type="text" name="sabhasadnumber" id="sabhasadnumber"
class="form-control form-sm"
placeholder="સભાસદ નંબર">
</label>
</div>
</div>
<div class="col-xs-6 col-xxs-12">
<div class="form-group">
<label>
<input type="hidden" id="village_id" name="village_id"
value="<?php echo $id; ?>">
<span class="text-darker ff--primary fw--500">સાખે</span>
<select class="form-control form-sm" name="Sakhe" id="Sakhe">
<option value=""> સાખે પસંદ કરો
</option>
<?php
$query = mysqli_query($conn, "select * from sakhe where status = 1 order by sakhe_id asc");
while ($row = mysqli_fetch_array($query)) {
echo "<option value = " . $row['sakhe_id'] . ">" . $row['name'] . "</option>";
}
?>
</select>
</label>
</div>
</div>
<div class="col-xs-12">
<button type="button" onclick="getresult()" class="btn btn-primary" id="shopsubmit" name="shopsubmit">
સબમિટ કરો
</button>
<button type="button" onclick="getresult()" class="btn btn-primary"
id="reset" name="reset">
ફરીથી સેટ કરો
</button>
</div>
</div>
</form>
</div>
</div>
<!-- Widget End -->
</div>
<!-- Main Sidebar End -->
</div>
</div>
</section>
<!-- Page Wrapper End -->
<!-- Footer Section Start -->
<!-- Footer Widgets End -->
<!-- Footer Extra Start -->
<?php include 'footer.php'; ?>
<!-- Footer Section End -->
</div>
<!-- Wrapper End -->
<!-- Back To Top Button Start -->
<div id="backToTop">
<i class="fa fa-caret-up"></i>
</div>
<!-- Back To Top Button End -->
<!-- ==== Plugins Bundle ==== -->
<script src="js/plugins.min.js"></script>
<!-- ==== Color Switcher Plugin ==== -->
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<!-- ==== Main Script ==== -->
<script src="js/main.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<!--<script src="http://malsup.github.com/jquery.form.js"></script>-->
<script src="myjs/member_list.js"></script>
</body>
<!-- Mirrored from themelooks.us/demo/socifly/html/members.html by HTTrack Website Copier/3.x [XR&CO'2014], Mon, 30 Sep 2019 09:33:46 GMT -->
</html>
This pagination is not working only on Mobile devices.
Please help.