search prod fix error #90

Merged
MarkHipe merged 1 commits from mark_4 into main 2024-05-30 13:38:34 +08:00
1 changed files with 384 additions and 403 deletions
Showing only changes of commit bcfae881a6 - Show all commits

View File

@ -298,165 +298,153 @@ $filteredProducts = [];
<script>
// JavaScript
document.addEventListener("DOMContentLoaded", function() {
const productsPerPage = 30;
let currentPage = 1;
let page = currentPage;
loadVendors(page); // Initial load of vendor products
loadProducts(page); // Initial load of products
// JavaScript
function filterFunction(checkedCategories, minPrice, maxPrice, products) {
var filteredProducts = [];
// Filter by category
if (checkedCategories.length > 0) {
let filteredProduct = products?.filter((product) => {
let categoryF = product?.product?.product_category?.toLowerCase();
// console.log('Category (lowercase):', categoryF);
let result = checkedCategories.includes(categoryF)
// console.log('Checked Categories:', result);
return result; // Return a boolean value indicating whether the category is included
});
filteredProducts = filteredProduct
console.log(filteredProducts);
const productsPerPage = 30;
let currentPage = 1;
let page = currentPage;
loadVendors(page); // Initial load of vendor products
loadProducts(page); // Initial load of products
// JavaScript
function filterFunction(checkedCategories, minPrice, maxPrice, products) {
var filteredProducts = [];
// Filter by category
if (checkedCategories.length > 0) {
let filteredProduct = products?.filter((product) => {
let categoryF = product?.product?.product_category?.toLowerCase();
// console.log('Category (lowercase):', categoryF);
let result = checkedCategories.includes(categoryF)
// console.log('Checked Categories:', result);
return result; // Return a boolean value indicating whether the category is included
});
filteredProducts = filteredProduct
console.log(filteredProducts);
} else {
// If no categories are selected, keep all products
filteredProducts = products;
}
} else {
// If no categories are selected, keep all products
filteredProducts = products;
}
// If minPrice or maxPrice is not provided, set them to default values
minPriceFinal = minPrice !== '' ? parseInt(minPrice) : 0;
maxPriceFinal = maxPrice !== '' ? parseInt(maxPrice) : Number.MAX_VALUE;
console.log(checkedCategories, minPrice, products)
// If minPrice or maxPrice is not provided, set them to default values
minPriceFinal = minPrice !== '' ? parseInt(minPrice) : 0;
maxPriceFinal = maxPrice !== '' ? parseInt(maxPrice) : Number.MAX_VALUE;
console.log(checkedCategories, minPrice, products)
// Filter by price range
// Filter by price range
if (minPrice !== '' || maxPrice !== '') {
// Filter by price range
// Filter by price range
if (minPrice !== '' || maxPrice !== '') {
filteredProducts = filteredProducts.filter(function(product) {
// Check if product has a sale price
var salePrice = parseInt(product.product.sale_price);
var regularPrice = parseInt(product.product.regular_price);
filteredProducts = filteredProducts.filter(function(product) {
// Check if product has a sale price
var salePrice = parseInt(product.product.sale_price);
var regularPrice = parseInt(product.product.regular_price);
// Check if salePrice and regularPrice are valid numbers
// Check if salePrice and regularPrice are valid numbers
// if (isNaN(salePrice) || isNaN(regularPrice)) {
// // One of the prices is not a valid number, use 0 instead
// salePrice = salePrice || 0;
// regularPrice = regularPrice || 0;
// }
var priceToCheck = salePrice > 0 ? salePrice : regularPrice;
// console.log(priceToCheck);
return priceToCheck >= minPriceFinal && priceToCheck <= maxPriceFinal;
});
}
console.log({
results: filteredProducts
});
// if (isNaN(salePrice) || isNaN(regularPrice)) {
// // One of the prices is not a valid number, use 0 instead
// salePrice = salePrice || 0;
// regularPrice = regularPrice || 0;
// }
var priceToCheck = salePrice > 0 ? salePrice : regularPrice;
// console.log(priceToCheck);
return priceToCheck >= minPriceFinal && priceToCheck <= maxPriceFinal;
});
}
console.log({
results: filteredProducts
});
// Final filtered products
// console.log({results:filteredProducts});
let final = filteredProducts
return final;
}
// Final filtered products
// console.log({results:filteredProducts});
let final = filteredProducts
return final;
}
function loadVendors(page, isFilter) {
document.querySelector(".vendor-list").innerHTML = "";
function loadVendors(page, isFilter) {
document.querySelector(".vendor-list").innerHTML = "";
// Create a new XMLHttpRequest object for fetching vendors
let xhrVendors = new XMLHttpRequest();
// Create a new XMLHttpRequest object for fetching vendors
let xhrVendors = new XMLHttpRequest();
// Define the endpoint URL for fetching vendors
let vendorsEndpointURL =
`https://<?php echo htmlspecialchars($_SESSION["data_endpoint"]); ?>/api/v1/vendors/search?q=<?php echo $_GET['search'] ?>`;
// Define the endpoint URL for fetching vendors
let vendorsEndpointURL =
`https://<?php echo htmlspecialchars($_SESSION["data_endpoint"]); ?>/api/v1/vendors/search?q=<?php echo $_GET['search'] ?>`;
// Open a GET request to fetch vendors
xhrVendors.open("GET", vendorsEndpointURL, true);
// Open a GET request to fetch vendors
xhrVendors.open("GET", vendorsEndpointURL, true);
// Set up a callback function to handle the vendors response
xhrVendors.onreadystatechange = function() {
if (xhrVendors.readyState === 4 && xhrVendors.status === 200) {
// Parse the response JSON for vendors
let vendorsResponse = JSON.parse(xhrVendors.responseText);
// Set up a callback function to handle the vendors response
xhrVendors.onreadystatechange = function() {
if (xhrVendors.readyState === 4 && xhrVendors.status === 200) {
// Parse the response JSON for vendors
let vendorsResponse = JSON.parse(xhrVendors.responseText);
// Create an array to store vendor IDs
let vendorIds = vendorsResponse.results.map(vendor => vendor._id);
// Create an array to store vendor IDs
let vendorIds = vendorsResponse.results.map(vendor => vendor._id);
// Create a new XMLHttpRequest object for fetching products
let xhrProducts = new XMLHttpRequest();
// Create a new XMLHttpRequest object for fetching products
let xhrProducts = new XMLHttpRequest();
// Define the endpoint URL for fetching products
let productsEndpointURL =
`https://<?php echo htmlspecialchars($_SESSION["data_endpoint"]); ?>/api/v1/products`;
// Define the endpoint URL for fetching products
let productsEndpointURL =
`https://<?php echo htmlspecialchars($_SESSION["data_endpoint"]); ?>/api/v1/products`;
// Open a GET request to fetch products
xhrProducts.open("GET", productsEndpointURL, true);
// Open a GET request to fetch products
xhrProducts.open("GET", productsEndpointURL, true);
// Set up a callback function to handle the products response
xhrProducts.onreadystatechange = function() {
if (xhrProducts.readyState === 4 && xhrProducts.status === 200) {
// Parse the response JSON for products
let productsResponse = JSON.parse(xhrProducts.responseText);
console.log(productsResponse)
// Create an object to store vendor-wise product counts
let vendorProductCounts = {};
// Set up a callback function to handle the products response
xhrProducts.onreadystatechange = function() {
if (xhrProducts.readyState === 4 && xhrProducts.status === 200) {
// Parse the response JSON for products
let productsResponse = JSON.parse(xhrProducts.responseText);
console.log(productsResponse)
// Create an object to store vendor-wise product counts
let vendorProductCounts = {};
// Iterate through each product and count the products associated with each vendor
productsResponse.forEach(function(product) {
// Increment product count for the vendor
if (!vendorProductCounts[product.vendor_api_id]) {
vendorProductCounts[product.vendor_api_id] = 1;
} else {
vendorProductCounts[product.vendor_api_id]++;
}
});
// Iterate through each product and count the products associated with each vendor
productsResponse.forEach(function(product) {
// Increment product count for the vendor
if (!vendorProductCounts[product.vendor_api_id]) {
vendorProductCounts[product.vendor_api_id] = 1;
} else {
vendorProductCounts[product.vendor_api_id]++;
}
});
// Now, we have vendor-wise product counts, we can use it to display the counts for each vendor
if (vendorsResponse.results.length > 0) {
// Now, we have vendor-wise product counts, we can use it to display the counts for each vendor
if (vendorsResponse.results.length > 0) {
vendorsResponse.results.slice(0, 6).forEach(function(
vendor) {
let vendorId = vendor._id;
let productCount = vendorProductCounts[
vendorId] || 0;
let vendorDateRegistered = new Date(vendor
.date_registered);
vendorsResponse.results.slice(0, 6).forEach(
function(vendor) {
let vendorDateRegistered = "";
let vendorId = vendor._id;
let productCount =
vendorProductCounts[vendorId] ||
0;
if (vendor.date_registered) {
vendorDateRegistered = new Date(
vendor.date_registered);
} else {
vendorDateRegistered =
"Not yet registered";
}
vendorsResponse.results.slice(0, 6).forEach(function(
vendor) {
let vendorDateRegistered = "";
let vendorId = vendor._id;
let productCount = vendorProductCounts[
vendorId] || 0;
if (vendor.date_registered) {
vendorDateRegistered = new Date(vendor
.date_registered);
} else {
vendorDateRegistered = "Not yet registered";
}
// Format the date as "Month DD, YYYY"
let options = {
month: 'long',
day: '2-digit',
year: 'numeric'
};
let formattedDate = "";
if (vendorDateRegistered !==
"Not yet registered") {
formattedDate =
vendorDateRegistered
.toLocaleDateString('en-US',
options);
} else {
formattedDate =
"Not yet registered";
}
// Create a product card element
let card = document.createElement(
"div");
card.classList.add("col-md-12");
card.innerHTML = `
// Format the date as "Month DD, YYYY"
let options = {
month: 'long',
day: '2-digit',
year: 'numeric'
};
let formattedDate = "";
if (vendorDateRegistered !==
"Not yet registered") {
formattedDate = vendorDateRegistered
.toLocaleDateString('en-US', options);
} else {
formattedDate = "Not yet registered";
}
// Create a product card element
let card = document.createElement("div");
card.classList.add("col-md-12");
card.innerHTML = `
<div class="card" style="margin:5px">
<div class="card-body">
<div class="vendor-info" style="display: flex; align-items: center; flex-wrap:wrap; justify-content:center">
@ -489,122 +477,111 @@ $filteredProducts = [];
</div>
</div>
</div>`;
// Append the product card to the container
document.querySelector(
".vendor-list")
.appendChild(card);
});
} else {
document.querySelector(".vendor-list")
.innerHTML = `
// Append the product card to the container
document.querySelector(".vendor-list")
.appendChild(card);
});
} else {
document.querySelector(".vendor-list").innerHTML = `
<h6>No vendors available</h6>
`;
}
}
};
// Send the request to fetch products
xhrProducts.send();
}
};
// Send the request to fetch vendors
xhrVendors.send();
}
}
};
function loadProducts(page, isFilter) {
// Make AJAX request to fetch products for given page
let xhr = new XMLHttpRequest();
xhr.open("GET",
"https://<?php echo htmlspecialchars($_SESSION["data_endpoint"]); ?>/api/v1/products/search?q=<?php echo $_GET['search'] ?>",
true);
// Send the request to fetch products
xhrProducts.send();
}
};
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
// Parse JSON response
let products1 = JSON.parse(xhr.responseText);
let products = products1.results.filter(product => product
.product
.product_type !== 'variation');
console.log(products);
// if(isFilter===true){
var checkedCategories = getCheckedCheckboxes();
var prices = getMinMaxPrices();
// Pass the values to your filter function
products = filterFunction(checkedCategories, prices.minPrice,
prices
.maxPrice, products);
// }
// Construct HTML for product cards
let productContainer = document.getElementById(
"product-container");
productContainer.innerHTML = ""; // Clear previous content
console.log(products)
let startIndex = (page - 1) * productsPerPage;
let endIndex = startIndex + productsPerPage - 1;
// Filter products for current page
if (products.length > 0) {
let productsForPage = products.slice(startIndex, endIndex +
1);
// Send the request to fetch vendors
xhrVendors.send();
}
function loadProducts(page, isFilter) {
// Make AJAX request to fetch products for given page
let xhr = new XMLHttpRequest();
xhr.open("GET",
"https://<?php echo htmlspecialchars($_SESSION["data_endpoint"]); ?>/api/v1/products/search?q=<?php echo $_GET['search'] ?>",
true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
// Parse JSON response
let products1 = JSON.parse(xhr.responseText);
let products = products1.results.filter(product => product.product
.product_type !== 'variation');
console.log(products);
// if(isFilter===true){
var checkedCategories = getCheckedCheckboxes();
var prices = getMinMaxPrices();
// Pass the values to your filter function
products = filterFunction(checkedCategories, prices.minPrice, prices
.maxPrice, products);
// }
// Construct HTML for product cards
let productContainer = document.getElementById("product-container");
productContainer.innerHTML = ""; // Clear previous content
console.log(products)
let startIndex = (page - 1) * productsPerPage;
let endIndex = startIndex + productsPerPage - 1;
// Filter products for current page
if (products.length > 0) {
let productsForPage = products.slice(startIndex, endIndex + 1);
productsForPage.forEach(function(prod) {
let product = prod.product;
let vendor = prod.vendor;
productsForPage.forEach(function(prod) {
let product = prod.product;
let vendor = prod.vendor;
let vendorOfProduct = prod.vendor;
// let card = document.createElement("div");
let token = "<?php echo $_SESSION['token'] ?>";
let email = "<?php echo $_SESSION['email'] ?>";
let password =
"<?php echo $_SESSION['password'] ?>";
let customer_data =
'<?php echo json_encode($customer_data) ?>';
let vendorOfProduct = prod.vendor;
// let card = document.createElement("div");
let token = "<?php echo $_SESSION['token'] ?>";
let email = "<?php echo $_SESSION['email'] ?>";
let password = "<?php echo $_SESSION['password'] ?>";
let customer_data =
'<?php echo json_encode($customer_data) ?>';
// Load product images dynamically
let imageContainer = document.createElement(
"div");
if (product.images && product.images.length >
0) {
let imageUrls = product.images.split(',');
let firstImageUrl = imageUrls[0].trim();
let img = document.createElement("img");
img.setAttribute("style",
"border: 1px solid #eeeeee; height: 330px; object-fit: cover;"
);
img.setAttribute("class", "main-image");
img.setAttribute("src", firstImageUrl);
img.setAttribute("loading", "lazy");
// Load product images dynamically
let imageContainer = document.createElement("div");
if (product.images && product.images.length > 0) {
let imageUrls = product.images.split(',');
let firstImageUrl = imageUrls[0].trim();
let img = document.createElement("img");
img.setAttribute("style",
"border: 1px solid #eeeeee; height: 330px; object-fit: cover;"
);
img.setAttribute("class", "main-image");
img.setAttribute("src", firstImageUrl);
img.setAttribute("loading", "lazy");
img.setAttribute("alt", "Product");
img.className = "main-image";
imageContainer.appendChild(img);
} else {
let img = document.createElement("img");
img.className = "main-image";
img.setAttribute("style",
"width: 290px; height: 200px; object-fit: cover;"
);
img.setAttribute("loading", "lazy");
img.setAttribute("alt", "Product");
img.className = "main-image";
imageContainer.appendChild(img);
} else {
let img = document.createElement("img");
img.className = "main-image";
img.setAttribute("style",
"width: 290px; height: 200px; object-fit: cover;"
);
img.setAttribute("loading", "lazy");
img.setAttribute("class", "main-image");
img.setAttribute("src",
"https://api.obanana.com/images/storage/web_images/1709002636671-viber_image_2024-02-22_15-54-42-498.png"
);
img.setAttribute("alt", "Product");
imageContainer.appendChild(img);
}
img.setAttribute("class", "main-image");
img.setAttribute("src",
"https://api.obanana.com/images/storage/web_images/1709002636671-viber_image_2024-02-22_15-54-42-498.png"
);
img.setAttribute("alt", "Product");
imageContainer.appendChild(img);
}
// Create product card
let card = document.createElement("div");
card.classList.add("col-lg-4", "col-md-6",
"col-sm-6",
"col-xs-6", "mb-6", "pro-gl-content",
"width-100");
card.innerHTML = `
// Create product card
let card = document.createElement("div");
card.classList.add("col-lg-4", "col-md-6", "col-sm-6",
"col-xs-6", "mb-6", "pro-gl-content", "width-100");
card.innerHTML = `
<div class="ec-product-inner">
<div class="ec-pro-image-outer" style="max-width: 290px; height: 350px;">
<div class="ec-pro-image">
@ -639,201 +616,198 @@ $filteredProducts = [];
</div>
</div>`;
productContainer.appendChild(card);
updatePaginationUI(page, products.length);
});
gridList()
} else {
document.getElementById("product-container").innerHTML = `
productContainer.appendChild(card);
updatePaginationUI(page, products.length);
});
gridList()
} else {
document.getElementById("product-container").innerHTML = `
<h6>No products available</h6>
`;
}
}
} else {
document.getElementById("product-container").innerHTML = `
} else {
document.getElementById("product-container").innerHTML = `
<h6>No products available</h6>
`;
}
};
}
};
xhr.send();
}
xhr.send();
}
function updatePaginationUI(page, totalProducts) {
let totalPages = Math.ceil(totalProducts / productsPerPage);
let paginationInner = document.getElementById("prod-search-pagination");
let paginationIndicator = document.querySelector(".page-indicator");
function updatePaginationUI(page, totalProducts) {
let totalPages = Math.ceil(totalProducts / productsPerPage);
let paginationInner = document.getElementById("prod-search-pagination");
let paginationIndicator = document.querySelector(".page-indicator");
paginationInner.innerHTML = ""; // Clear previous pagination
let startPage = 1;
let endPage = totalPages;
paginationInner.innerHTML = ""; // Clear previous pagination
let startPage = 1;
let endPage = totalPages;
const visiblePages = 5; // Number of visible page links excluding ellipses
const visiblePages = 5; // Number of visible page links excluding ellipses
if (totalPages > visiblePages) {
if (page <= Math.ceil(visiblePages / 2)) {
endPage = visiblePages;
} else if (page >= totalPages - Math.floor(visiblePages / 2)) {
startPage = totalPages - visiblePages + 1;
} else {
startPage = page - Math.floor(visiblePages / 2);
endPage = page + Math.ceil(visiblePages / 2) - 1;
}
}
if (totalPages > visiblePages) {
if (page <= Math.ceil(visiblePages / 2)) {
endPage = visiblePages;
} else if (page >= totalPages - Math.floor(visiblePages / 2)) {
startPage = totalPages - visiblePages + 1;
} else {
startPage = page - Math.floor(visiblePages / 2);
endPage = page + Math.ceil(visiblePages / 2) - 1;
}
}
// Display ellipsis at the beginning if necessary
if (startPage > 1) {
let firstPageLi = document.createElement("li");
let firstPageLink = document.createElement("a");
firstPageLink.setAttribute("href", "#");
firstPageLink.setAttribute("data-page", 1);
firstPageLink.textContent = 1;
firstPageLi.appendChild(firstPageLink);
paginationInner.appendChild(firstPageLi);
// Display ellipsis at the beginning if necessary
if (startPage > 1) {
let firstPageLi = document.createElement("li");
let firstPageLink = document.createElement("a");
firstPageLink.setAttribute("href", "#");
firstPageLink.setAttribute("data-page", 1);
firstPageLink.textContent = 1;
firstPageLi.appendChild(firstPageLink);
paginationInner.appendChild(firstPageLi);
// Display ellipsis after the first page link if necessary
if (startPage > 2) {
let ellipsisLi = document.createElement("li");
ellipsisLi.textContent = "...";
paginationInner.appendChild(ellipsisLi);
}
}
// Display ellipsis after the first page link if necessary
if (startPage > 2) {
let ellipsisLi = document.createElement("li");
ellipsisLi.textContent = "...";
paginationInner.appendChild(ellipsisLi);
}
}
for (let i = startPage; i <= endPage; i++) {
let li = document.createElement("li");
let a = document.createElement("a");
a.setAttribute("href", "#");
a.setAttribute("data-page", i);
a.textContent = i;
if (i === page) {
a.classList.add("active");
}
li.appendChild(a);
paginationInner.appendChild(li);
}
for (let i = startPage; i <= endPage; i++) {
let li = document.createElement("li");
let a = document.createElement("a");
a.setAttribute("href", "#");
a.setAttribute("data-page", i);
a.textContent = i;
if (i === page) {
a.classList.add("active");
}
li.appendChild(a);
paginationInner.appendChild(li);
}
// Display ellipsis at the end if necessary
if (endPage < totalPages) {
let li = document.createElement("li");
li.textContent = "...";
paginationInner.appendChild(li);
// Display ellipsis at the end if necessary
if (endPage < totalPages) {
let li = document.createElement("li");
li.textContent = "...";
paginationInner.appendChild(li);
let lastPageLi = document.createElement("li");
let lastPageLink = document.createElement("a");
lastPageLink.setAttribute("href", "#");
lastPageLink.setAttribute("data-page", totalPages);
lastPageLink.textContent = totalPages;
lastPageLi.appendChild(lastPageLink);
paginationInner.appendChild(lastPageLi);
}
let lastPageLi = document.createElement("li");
let lastPageLink = document.createElement("a");
lastPageLink.setAttribute("href", "#");
lastPageLink.setAttribute("data-page", totalPages);
lastPageLink.textContent = totalPages;
lastPageLi.appendChild(lastPageLink);
paginationInner.appendChild(lastPageLi);
}
// Update pagination indicator
let startIndex = (page - 1) * productsPerPage + 1;
let endIndex = Math.min(startIndex + productsPerPage - 1, totalProducts);
paginationIndicator.textContent = "Showing " + startIndex + " to " +
endIndex + " of " +
totalProducts + " item(s)";
}
// Update pagination indicator
let startIndex = (page - 1) * productsPerPage + 1;
let endIndex = Math.min(startIndex + productsPerPage - 1, totalProducts);
paginationIndicator.textContent = "Showing " + startIndex + " to " + endIndex + " of " +
totalProducts + " item(s)";
}
function getCheckedCheckboxes() {
var checkboxes = document.querySelectorAll(
'input[name="category[]"]:checked');
var values = [];
checkboxes.forEach(function(checkbox) {
values.push(checkbox.value.toLowerCase().trim());
});
return values;
}
function getCheckedCheckboxes() {
var checkboxes = document.querySelectorAll('input[name="category[]"]:checked');
var values = [];
checkboxes.forEach(function(checkbox) {
values.push(checkbox.value.toLowerCase().trim());
});
return values;
}
// Function to get min and max prices
function getMinMaxPrices() {
var minPrice = document.getElementById('minPrice').value;
var maxPrice = document.getElementById('maxPrice').value;
return {
minPrice: minPrice,
maxPrice: maxPrice
};
}
// Function to get min and max prices
function getMinMaxPrices() {
var minPrice = document.getElementById('minPrice').value;
var maxPrice = document.getElementById('maxPrice').value;
return {
minPrice: minPrice,
maxPrice: maxPrice
};
}
// Function to handle form submission
function applyFilters() {
var checkedCategories = getCheckedCheckboxes();
var prices = getMinMaxPrices();
// Pass the values to your filter function
filterFunction(checkedCategories, prices.minPrice, prices.maxPrice);
}
// Function to handle form submission
function applyFilters() {
var checkedCategories = getCheckedCheckboxes();
var prices = getMinMaxPrices();
// Pass the values to your filter function
filterFunction(checkedCategories, prices.minPrice, prices.maxPrice);
}
var checkboxes = document.querySelectorAll('input[name="category[]"]');
checkboxes.forEach(function(checkbox) {
checkbox.addEventListener('change', function() {
loadProducts(1, true);
});
});
var checkboxes = document.querySelectorAll('input[name="category[]"]');
checkboxes.forEach(function(checkbox) {
checkbox.addEventListener('change', function() {
loadProducts(1, true);
});
});
function gridList(e) {
console.log("hereeeee")
var $gridCont = $('.shop-pro-inner');
var $gridView = $('.pro-gl-content');
// e.preventDefault();
$gridCont.removeClass('list-view');
$gridView.removeClass('width-100');
}
// Listen for changes in min and max price inputs
var minPriceInput = document.getElementById('minPrice');
minPriceInput.addEventListener('input', function() {
loadProducts(1, true);
});
function gridList(e) {
console.log("hereeeee")
var $gridCont = $('.shop-pro-inner');
var $gridView = $('.pro-gl-content');
// e.preventDefault();
$gridCont.removeClass('list-view');
$gridView.removeClass('width-100');
}
// Listen for changes in min and max price inputs
var minPriceInput = document.getElementById('minPrice');
minPriceInput.addEventListener('input', function() {
loadProducts(1, true);
});
var maxPriceInput = document.getElementById('maxPrice');
maxPriceInput.addEventListener('input', function() {
loadProducts(1, true);
});
var maxPriceInput = document.getElementById('maxPrice');
maxPriceInput.addEventListener('input', function() {
loadProducts(1, true);
});
document.getElementById("prod-search-pagination").addEventListener("click",
function(
event) {
if (event.target.tagName.toLowerCase() === "a") {
event.preventDefault(); // Prevent default link behavior
let page = parseInt(event.target.getAttribute("data-page"));
currentPage = page;
loadProducts(page, false);
// Scroll to top
window.scrollTo({
top: 0,
behavior: "smooth" // Optional smooth scrolling behavior
});
}
});
document.getElementById("prod-search-pagination").addEventListener("click", function(
event) {
if (event.target.tagName.toLowerCase() === "a") {
event.preventDefault(); // Prevent default link behavior
let page = parseInt(event.target.getAttribute("data-page"));
currentPage = page;
loadProducts(page, false);
// Scroll to top
window.scrollTo({
top: 0,
behavior: "smooth" // Optional smooth scrolling behavior
});
}
});
// Load initial products on page load
loadProducts(currentPage);
// Attach click event listeners to pagination links
// document.getElementById("pagination-container").addEventListener("click", function(event) {
// if (event.target.tagName.toLowerCase() === "a") {
// event.preventDefault(); // Prevent default link behavior
// let page = event.target.getAttribute("data-page");
// loadProducts(page); // Load products for the clicked page
// }
// });
// Load initial products on page load
loadProducts(currentPage);
// Attach click event listeners to pagination links
// document.getElementById("pagination-container").addEventListener("click", function(event) {
// if (event.target.tagName.toLowerCase() === "a") {
// event.preventDefault(); // Prevent default link behavior
// let page = event.target.getAttribute("data-page");
// loadProducts(page); // Load products for the clicked page
// }
// });
// // Attach event listener to search form or button
// document.getElementById("search-form").addEventListener("submit", function(event) {
// event.preventDefault(); // Prevent default form submission
// let searchQuery = document.getElementById("search-input").value;
// console.log(searchQuery + " search clicked");
// // Make AJAX request to fetch products based on search query
// // You need to implement this part in a similar way to loading products
// });
});
// // Attach event listener to search form or button
// document.getElementById("search-form").addEventListener("submit", function(event) {
// event.preventDefault(); // Prevent default form submission
// let searchQuery = document.getElementById("search-input").value;
// console.log(searchQuery + " search clicked");
// // Make AJAX request to fetch products based on search query
// // You need to implement this part in a similar way to loading products
// });
});
</script>
<!-- Sidebar Area Start -->
<div class="ec-shop-leftside col-lg-3 order-lg-first col-md-12 order-md-last">
@ -1279,7 +1253,7 @@ $filteredProducts = [];
<h6>stylish baby shoes</h6>
<p>10 Minutes ago</p>
</div>
<a href="javascript:void(0)" class="icon-btn recent-close">×</a>
<a href="javascript:void(0)" class="icon-btn recent-close">×</a>
</div> -->
<!-- Recent Purchase Popup end -->
@ -1393,4 +1367,11 @@ $filteredProducts = [];
</body>
</html>
</html>
Powered by Gitea
Version: 1.21.5 Page:
215ms
Template:
22ms
Licenses
API