I am creating a page display a list of products and want to be able to filter by category, have pages, a item per page limit and a sort order
on the store page I do a database call to generate all categories and put them in a sidebar.
Then on click/change serialize all the date on the form using $('#form').serialize() then pass it to request_handler.php which will return the correct data.
The problem is, is that because it is all POST data there is no URL reference so people will not be able to link to the results from their choice similar to - http://www.asos.com/Men/Shirts/Cat/pgecategory.aspx?cid=3602#state=Rf989%3D6200%2C4885&parentID=Rf989&pge=0&pgeSize=36&sort=-1 Also you will not be able to go back and forth because it is all AJAX. I may be able to solve this with history JS but im not sure how to use a url to get the desired results.
<?php
// Database config file, db login settings
require_once '../inc/dbconfig.php';
try {
// connect to database;
$conn = new PDO("mysql:host=$host;dbname=$dbname", $username, $password);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt_all_results = $conn->prepare('SELECT * FROM films ORDER BY category ASC');
$stmt_all_results->execute();
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<form id="store">
<ul>
<?php
$category = null;
while($r = $stmt_all_results->fetch()){
if ($category != $r['category']) {
$category = $r['category'];
echo '<li>
<label for="cat-' . $category . '">
<input type="checkbox" name="cat[]" id="cat-'. $category .'" value="' . $category . '">'
. $category .
'</label>
</li>';
}
}
?>
</ul>
</form>
<div class="result"></div>
<?php
// close try
} catch(PDOException $e) {
echo 'ERROR: ' . $e->getMessage();
}
?>
<!-- LOAD JQUERY -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
function get_data(dat){
$.post( "request_handler.php", dat)
.done(function( data ) {
$( ".result" ).html( data );
});
}
$('li').change(function(){
var dat = $('#store').serialize();
get_data(dat);
})
</script>
Request Handler Script
<?php
// Database config file
require_once '../inc/dbconfig.php';
$category =$_POST['cat'];
foreach ($category as $i){
$options[] = "category='" . $i ."'";
}
$sql = "SELECT * FROM databse";
if (count($options)){
$sql .= " WHERE " . implode(' OR ', $options);
}
try {
// connect to database;
$conn = new PDO("mysql:host=$host;dbname=$dbname", $username, $password);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt_all_results = $conn->prepare($sql);
$stmt_all_results->execute();
# default
$get_pages = isset($_GET['page']) ? $_GET['page'] : 1;
while($row = $stmt_all_results->fetch()) {
$product_title = $row['title'];
$product_image = $row['image_src'];
$product_category = $row['category'];
$product_id = $row['id'];
?>
<ul>
<li>
<img src="<?php echo $product_image; ?>">
<h4><?php echo $product_title; ?></h4>
<p><?php echo $product_category; ?></h4>
<a href="product?id=<?php echo $product_id; ?>">More Info</a>
</li>
</ul>
<?php
}
} catch(PDOException $e) {
echo 'ERROR: ' . $e->getMessage();
}
?>
-if this post is confusing don't attack it just suggest rewording as i have been searching all day to solve this issue - thanks