Ajax filtering
Technical documentation for Shoporama's /ajax endpoint for filtering products. For developers.
All Shoporama stores have an /ajax endpoint that returns products in JSON format. This makes it possible to dynamically fetch and filter products with JavaScript - without reloading the entire page.
What is the /ajax endpoint?
The /ajax endpoint returns products based on the parameters you submit with. You can filter by category, extra fields, price, tags and more.
Basic usage
A simple AJAX call to fetch products from a category:
fetch('/ajax?category_id=123') .then(response => response.json()) .then(data => { // data.products contains the products // data.count contains the total number });
Available parameters
| Parameter | Description of the parameter |
|---|---|
category_id | Filter by category ID |
tag | Filter by tag |
extra_field[field]=value | Filter by extra fields |
price_from / price_to | Price range |
sort | Sorting (e.g. price_asc, price_desc, name) |
limit / offset | Pagination |
Example: Filtering with additional fields
// Fetch red products in category 123, sorted by price fetch('/ajax?category_id=123&extra_field[color]=red&sort=price_asc') .then(response => response.json()) .then(data => { data.products.forEach(product => { console.log(product.name, product.price); }); });
Implementation in your theme
To build a complete filtering experience, your developer needs to:
- Create filter UI with checkboxes/dropdowns based on available extra fields
- Listen to changes in the filters
- Call
/ajaxwith the selected parameters - Dynamically update the product list with the returned data
Tips for filtering
Read more about filtering in general in our article Filtering on your online shop.
Do you need help? Contact us at support@shoporama.dk.