0

Recently new to Craft and Twig although I have used Expression Engine in the past. I am looking for a way to update a for loop that is pulling entries from a defined category based on the current entry/page category by using a dropdown list with all categories available.

Entries: Vehicles

Categories: Truck, Suv, Compact, Economy

Fields: Color, numofDoors, passangers, gasmileage

Example of code:

{% set related = craft.entries.section('vehicles').relatedTo(entryVehicleCategories%} {% for vehicle in related %} {% if related|length %} <h2>Name:{{vehicle.name}}</h2> <p>color:{{vehicle.color}}</p> <p>Number of doors:{{vehicle.numofdoors}}</p> {% else %} <h2>No content</h2> {% endif %} {% endfor %} <form action="{{ url('search/results') }}"> <select name="vehicle-search" placeholder="Search"> <option value="Truck">Truck</option> <option value="Suv"> Suv </option> <option value="Compact"> Compact </option> <option value="Economy"> Economy </option> </select> <input type="submit" value="Go"> </form>

Upon form submit I am hoping I can change/set related to something new.

Example: Current loop is looping and showing all related truck entries.

Action wanted: User selects suv and div reloads suv entries on page without reloading page.

Improve this question

1 Answer 1

Reset to default
1

You will need to use JavaScript, either AJAX calling to a template that re-runs a new Twig for loop and returns the results in HTML, or a framework like Vue or React in conjunction with P&T's Element API that will create an endpoint of your section's entries in JSON format.

If you don't mind a page refresh, you can filter your entries dynamically using craft.request to grab pretty much whatever you want: a segment from the URL, query string, post data, etc. So basically, when the form submits, your redirect url should go to that page and either you add submitted data to the url via get or grab the data via post.

Also, fyi, you have a syntax error in your code: missing a ) at the end of your .relatedTo ;)

Improve this answer
2
  • So there is no easy or simple way to do something such as onSubmit(); {{% set related = craft.entries.section('vehicles').relatedTo("FormVariable")%}} Commented Sep 20, 2017 at 22:26
  • 1
    Twig is a templating language that compiles down to PHP on the server, which then compiles down to an HTML file that is sent out to the browser requesting it. If you press submit on a form, you yourself are working from the browser (not from the server), and either you are sending something back to the server to process and then receiving a response from said server, or you are running some javascript in the browser to do any number of things. So you're wanting to run a client-side process on server-side code. That's not how it works. The "easy/simple" way(s) is mentioned above. Commented Sep 20, 2017 at 22:51

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.