404 Not Found

<?php
header('Access-Control-Allow-Origin: *');
require_once 'admin/dbconnection.php';
error_reporting(0);
$pagetitle = "ST Engineers - Blogs";
require 'header.php';

if (isset($_GET['page_no']) && $_GET['page_no'] != "") {
    $page_no = $_GET['page_no'];
} else {
    $page_no = 1;
}
$total_records_per_page = 6;
$offset = ($page_no - 1) * $total_records_per_page;
$previous_page = $page_no - 1;
$next_page = $page_no + 1;
$adjacents = "2";
$result_count = mysqli_query(
    $con,
    "SELECT COUNT(*) As total_records FROM `blogs` WHERE status='active'"
);
$total_records = mysqli_fetch_array($result_count);
$total_records = $total_records['total_records'];
$total_no_of_pages = ceil($total_records / $total_records_per_page);
$second_last = $total_no_of_pages - 1; // total pages minus 1
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link rel="stylesheet" href="build/css/intlTelInput.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.4/inputmask/inputmask.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.4/inputmask/jquery.inputmask.js"></script>
<script type='text/javascript'
    src="https://rawgit.com/RobinHerbots/jquery.inputmask/3.x/dist/jquery.inputmask.bundle.js"></script>

<section class="blog-banner">
            
            <div class="d-flex flex-column align-items-center ">
                <div class="page-header__innernae text-center">
                    <h1>Blogs</h1>
                    <p>Innovative technological solutions to the manufacturing sector</p>
                </div>
            </div>
        </section>

<section class="blog-sec ">
    <div class="container">
        <div class="row">
            <div class="col-md-8">
                <!-- <div id="blog_id">

</div> -->
                <h5></h5>
                <?php
$result = mysqli_query(
    $con,
    "SELECT * FROM `blogs` WHERE status='active' ORDER BY id DESC LIMIT  $offset, $total_records_per_page"
);
while ($row = mysqli_fetch_array($result)) {
    echo "<div class='blog-box'>

<h2 class='mt-3'>  $row[title]  </h2>
                  <p class='mt-3 text-justify'>  $row[description] </p></a>

</div>
                  </div>
    </div>";

}

<div class="pagination-wrapper mt-3 mb-5">
<ul class="pagination justify-content-center">
    <?php if ($page_no > 1): ?>
        
        
        
        <li class="page-item">
            <a class="page-link" href="?page_no=<?= $previous_page ?>">Prev</a>
        </li>
    <?php endif; ?>

<?php for ($i = 1; $i <= $total_no_of_pages; $i++): ?>
        <li class="page-item <?= ($i == $page_no) ? 'active' : '' ?>">
            <a class="page-link" href="?page_no=<?= $i ?>"><?= $i ?></a>
        </li>
    <?php endfor; ?>

<?php if ($page_no < $total_no_of_pages): ?>
        <li class="page-item">
            <a class="page-link" href="?page_no=<?= $next_page ?>">Next</a>
        </li>
        
        
        
    <?php endif; ?>
</ul>
</div>

</div>

<div class="col-md-4">
                <section class="recent_topics mt-4 p-2 mt-3 p-3">
                    <h5>Recent Posts</h5>
                    <div id="post_id"></div>

</section>
            </div>

</div>
    </div>
</section>

$.each(responseObject, function(k, v) {

// console.log(v, "#Ramya");
                // console.log(k.length, "123");

data +=
                    '<div class="pg_li" >';

data += '<img  class="img-fluid" src= "' +
                    v.thump_image + '">';
                data +=
                    '<a href="' +
                    v
                    .blog_url +
                    '" class="d-inline-block">';
                data += '<div class="p-4 card_content">';

data += '<h2 class="mt-3">' + v.title + "</h2>";
                data += '<p class="mt-3 text-justify">" ' + v.description + '"</p>';
                data += "</a>";
                data +=
                    '<div class="blog_social_media mt-3 d-flex justify-content-between">';
                data += '<div class="social_media_icon">';
                data +=
                    '<a href="http://"><img src="images/linkedin.png" alt="" srcset=""></a>';
                data +=
                    '<a href="http://"><img src="images/facebook.png" alt="" srcset=""></a>';
                data +=
                    ' <a href="http://"><img src="images/instagram.png" alt="" srcset=""></a>';
                data += '</div>';

data +=
                    '<a href="' +
                    v
                    .blog_url +
                    '" class="blog_view_more"> View More <span class="p-2"> <img src="images/arrow-right.png" alt="" ></span>';
                data += '</a>';

data += '</div>';
                data += '</div>';
                data += '</div>';
                data += '</div>';

});
            $("#blog_id").html(data);

}
    });
});
</script>

$.ajax({
    url: 'admin/api/admin-blog.php',
    type: 'POST',
    data: {

action: "selectblog_for_home",
        referer: "ezioaws"
    },
    success: function(response) {
        var responseObj = JSON.parse(response);;

var data = '<div class="recent_posts">';

$.each(responseObj, function(k, v) {

data += '<img class="img-fluid" src= "' + v.thump_image + '">';

data +=
                '<a href="blogs/' +
                v.blog_url + '" >';
            data += '<div style="margin-top: 10px;"  class="head-part d-flex justify-content-between">';
            data += "<h6>" + v.title + "</h6>";

data += '</div>';
            data += '</a><br>';

// data += '<p class="mt-3 text-justify">" ' + v.description + '"</p>';

});

$("#post_id").html(data);
    }

});
</script>

const paginationLimit = 2;
    // const pg_lent = $('.pg_li').length;
    const pg_lent = document.getElementsByClassName('blog_id');

console.log(pg_lent, "lenzzz");

console.log(pg_lent.length, "pg");

boxArray.forEach((e) => {
        console.log(e, "ee");
    })
    const paginationNumbers = document.getElementById("pagination-numbers");
    const nextButton = document.getElementById("next-button");
    const prevButton = document.getElementById("prev-button");
    const pageCount = Math.ceil(responseObject.length / paginationLimit);

// console.log(pageCount, "2");
    let currentPage = 1;

const disableButton = (button) => {
        button.classList.add("disabled");
        button.setAttribute("disabled", true);
    };

const enableButton = (button) => {
        button.classList.remove("disabled");
        button.removeAttribute("disabled");
    };

// const handlePageButtonsStatus = () => {
    //     if (currentPage === 1) {
    //         disableButton(prevButton);
    //     } else {
    //         enableButton(prevButton);
    //     }

//     if (pageCount === currentPage) {
    //         disableButton(nextButton);
    //     } else {
    //         enableButton(nextButton);
    //     }
    // };

// const handleActivePageNumber = () => {
    //     document.querySelectorAll(".pagination-number").forEach((button) => {
    //         button.classList.remove("active");
    //         const pageIndex = Number(button.getAttribute("page-index"));
    //         if (pageIndex == currentPage) {
    //             button.classList.add("active");
    //         }
    //     });
    // };

const appendPageNumber = (index) => {
        const pageNumber = document.createElement("button");
        pageNumber.className = "pagination-number";
        pageNumber.innerHTML = index;
        pageNumber.setAttribute("page-index", index);
        pageNumber.setAttribute("aria-label", "Page " + index);

paginationNumbers.appendChild(pageNumber);
    };

const getPaginationNumbers = () => {
        for (let i = 1; i <= pageCount; i++) {
            appendPageNumber(i);
        }
    };

const setCurrentPage = (pageNum) => {
        currentPage = pageNum;

// handleActivePageNumber();
        // handlePageButtonsStatus();

const prevRange = (pageNum - 1) * paginationLimit;
        const currRange = pageNum * paginationLimit;
        console.log(responseObject.length, "responses");
        // responseObject.forEach((item, index) => {
        //     console.log(item, "item");
        //     item.classList.add("hidden");
        //     if (index >= prevRange && index < currRange) {
        //         item.classList.remove("hidden");
        //     }
        // });
    };

window.addEventListener("load", () => {
        getPaginationNumbers();
        setCurrentPage(1);

prevButton.addEventListener("click", () => {
            setCurrentPage(currentPage - 1);
        });

nextButton.addEventListener("click", () => {
            setCurrentPage(currentPage + 1);
        });

document.querySelectorAll(".pagination-number").forEach((button) => {
            const pageIndex = Number(button.getAttribute("page-index"));

if (pageIndex) {
                button.addEventListener("click", () => {
                    setCurrentPage(pageIndex);
                });
            }
        });
    });

});
</script>

<?php require 'footer.php';?>