I am currently working on improving the functionality of my search and filter features. I have successfully implemented a search feature that filters results by stock, distance, price, and time response. While the search feature is functioning properly, the filter feature that I created is not working as expected.
My goal is to provide users with additional filtering options after they conduct a search. For example, selecting criteria such as stock and distance should dynamically update the search results based on the selected filter (e.g., displaying items available in stock). Other filters like price and time response should also work similarly - sorting items by price or response time upon selection.
Example Scenario:
When choosing Type as BMW and performing a search, 2 item results with type BMW should be displayed. Subsequently, selecting 500 KM in the Distance filter should refine the results to show only 1 item. However, the filters are currently malfunctioning.
In cases where there are 6 item results, clicking on the price filter should organize the items from lowest to highest price.
I have included a code snippet below detailing my implementation. Any assistance in resolving this issue would be greatly appreciated.
new Vue({
// JavaScript code goes here
}).list-item{
/* CSS styling for list items */
}
/* Additional CSS styles go here */
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.1/vue.js"></script>
<div id="app">
<!-- HTML markup for the app goes here -->
</div>