7

Is there a way to create the following menu with Expresso Store search tag. I can't seem to get my head around how to do this. I really need a simple way to start filtering products. Very confused.

<select name="range:regular_price">
    <option value="">All</option>
    <option value=";99">$0.00 - $99.99</option>
    <option value="100;199">$100.00 - $199.99</option>
    <option value="200;399">$200.00 - $399.99</option>
    <option value="400;799">$400.00 - $799.99</option>
    <option value="800;">$800.00 and over</option>
</select>

{exp:store:search channel="products" search:price:min="0" search:price:max="99"}

Hi folks. I'm so stinken confused with this. Here's an image of what I'm trying to do with the Expresso Store module. I really want to have a dropdown menu to filter results. I would love it to refresh on the same page. I would even be OK if it used a submit button for the refresh. Is there any easy way to do this. I apologize for my lack of knowledge. Really struggling ;(

enter image description here

Improve this question
4
  • Generally we link to templates such as /products/price/100/200, then pass the segment variables through to the search tag. For what you're doing, you might be able to use a plugin like server variable to get the POST data and put it into your template?
    – Adrian Macneil
    Commented Dec 6, 2012 at 4:19
  • Sorry for the delay. I'm still trying to sort this issue out. I don't understand how you get 100/200 in the URL. Are these templates within additional folders. Secondly is there a way to keep the current category that you're in. For example... If a user is looking at Central vacs, can I only show central vacs in a selected price range. Thanks in advance. I've never struggled this much with a project.
    – Mark Dodgson
    Commented Dec 11, 2012 at 21:08
  • I have edited the post to reflect the current state of the project. Any suggestions?
    – Mark Dodgson
    Commented Dec 12, 2012 at 21:27
  • Please don't completely rewrite your question as something different, as now all the answers are irrelevant and won't help future users. Create a new question for each separate question.
    – Adrian Macneil
    Commented Dec 14, 2012 at 8:25

1 Answer 1

Reset to default
7

Going off Adrian’s comment, this is how I would approach it. I haven’t used Expresso Store (yet) so I can’t give you the exact code. But hopefully it will get you going in the right direction?

I would take your form and update it like this:

<select name="range:regular_price">
  <option value="/products">All</option>
  <option value="/products/price/-/99">$0.00 - $99.99</option>
  <option value="/products/price/100/200">$100.00 - $199.99</option>
  <option value="/products/price/200/399">$200.00 - $399.99</option>
  <option value="/products/price/400/800">$400.00 - $799.99</option>
  <option value="/products/price/800/10000">$800.00 and over</option>
</select>

You’ll need to add some javascript to the part to make it update upon selection, such as (sorry, my JavaScript isn’t the best… - I can't figure out how to put that into SE, so here is a link). Basically, every time the user changes the dropdown, redirect to the appropriate URL.

You could also just use standard <a> links to get the user to the correct URL.

Then I would have a template in the Products folder called “price” (or you could call it “filter” if you already have one). Pass the prices through to the search tag as segment variables:

{exp:store:search channel="products" search:price:min="{segment_3}" search:price:max="{segment_4}"}

Then proceed with the rest of the code to display the results.

Improve this answer
7
  • You were definitely on the right track. I just simplified your conditional, which wasn't necessary. You can just pass the segment variables straight through to the store tag.
    – Adrian Macneil
    Commented Dec 11, 2012 at 22:21
  • @AdrianMacneil I was just about to suggest that as well. No need for a conditional or Switchee in this case.
    – Natetronn
    Commented Dec 11, 2012 at 22:23
  • Note: nothing really exists at /-/99, /100/199, /200/399 so on and so forth though, we can still get their values using segment variables ie {segment_3}. Each one of the links above will hit the /products/price template and the segments will be passed to the {exp:store:search} parameters in-turn displaying the proper search range.
    – Natetronn
    Commented Dec 11, 2012 at 22:27
  • Thanks - I had thought about just passing the segment variables too but wasn't sure whether that would get the necessary values for every option. But the adjustments you made are great. Simpler is better!
    – Todd
    Commented Dec 12, 2012 at 1:12
  • I can't thank you enough for responding. It's all starting to make a little more sense. I've got the jump menu working, but do you have any idea how I can only perform the filtering on a specific category. I wasn't sure how I can pass the category to the price template. I don't want to have to create a price template for every product category. There are about 50. Any suggestions?
    – Mark Dodgson
    Commented Dec 12, 2012 at 16:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.