Liquid Sorting workaround - strange quirk

[LarrySawyer27]

Basically, we have a Food web app, which contains all of the restaurant's menu items. Each menu item can appear in any or all of these sections—brunch, lunch, supper, kids, and catering—and has separate price and description fields for each. They also have separate "number" fields for each, which is basically weighting. An item with a "Lunch Number" of 1 should show up first in its section.

Here's the code that makes that happen, a combination of ideas from other forum posts...

                    {module_webapps id="23256" filter="classified" itemId="113803" template="" collection="appetizers"}
                    {% capture appetizersData -%}
                        {% for i in appetizers.items -%}
                            {% if i.["supper number"] != "" -%}
                            {{i.["supper number"]}}-{{i.itemid}},
                        {% else -%}
                            {{i.name | downcase | remove: 'the ' | truncatewords: 1,''}}-{{i.itemid}},
                        {% endif -%}
                        {% endfor -%}
                    {% endcapture -%}
                   
                    {% assign appetizersArray = appetizersData | split: ',' | sort %}
                    {% for i in appetizersArray -%}
                        {% assign appetizersId = i | split: '-' %}
                        {% for d in appetizersId offset:1 %}
                        {module_webapps id="23256" filter="item" itemId="{{d}}" template="/Layouts/WebApps/Food/supper.tpl"}
                        {% endfor -%}
                    {% endfor -%}

I'm sure it's not the most efficient to call each item in a loop like this, but it gets the custom sorting job done for this site.

The quirk that's happening is that most of the sections that use this are taking the first item alphabetically and sticking at the top, and then sorting the rest by the custom field. For example, on this page (https://cafemiranda.worldsecuresystems.com/menu/supper), under Appetizers, 50 MPH Tomatoes should be 12th in the list, but it's coming up first because it's the first one alphabetically. The items under Fries with That? are working fine, using the same liquid code.

That was kind of a lot, but any thoughts?

[Liam Dilley · Accepted solution]

- Liquid supports sorting in Arrays.

- BC does not support sorting on collections.

- You do not need to do the above.

Step one - pass a collection to a variable.

{% myarray =  appetizers.items -%}

{% myarray =  myarray | sort: 'mycustomfield' -%}

Done

[LarrySawyer27]

Wow, so much simpler, and it works perfectly! 17 lines down to 8, and this will simplify things on a number of our sites. Thank you!

For posterity, here's what I ended up with:

                    {module_webapps id="23256" filter="classified" itemId="113803" template="" collection="appetizers"}

                    {% assign appetizersArray =  appetizers.items -%}

                    {% assign appetizersArray =  appetizersArray | sort: 'supper number' -%}

                    {% for i in appetizersArray -%}

                    <li>

                        <h4 class="item-name">{{i.name}}</h4>

                        <p class="item-desc">{{i.["supper description"]}} <span class="item-price">{{i.["supper price"]}}</span></p>

                    </li>

                    {% endfor -%}

[higgeldy-piggeldy]

This is awesome Liam,

I'm also using this to sort menu items by price.

The price field does not contain a currency symbol, it only contains a number.

When we have double digit numbers it works to sort from lowest to highest  e.g. 13 is listed before 23

However, it does not recognise that 8 is lower than 13!

Any workaround for this?

Here is the code I'm using.

<h3>Bar Snacks & Sharing</h3>

     {module_webapps id="35427" filter="classified" itemId="70724" collection="food" template=""}

     {% assign snackArray =  food.items -%}

     {% assign snackArray =  snackArray | sort: 'Price' -%}

     {% for item in snackArray %}

     <p> {% if item.BoxOffice == true -%} <i class="fa fa-ticket small" aria-hidden="true"></i> {% endif %} {% if item.QuickMenu == true      -%} <i class="fa fa-rocket small" aria-hidden="true"></i> {% endif %} {{ item.name }} <strong>${{ item.price }}</strong> <br />

     {{ item.description }} <span class="small">{{ item.source }}</span> </p>

     {% endfor %}

[Liam Dilley]

It is only performing a default code sort.

In that case when it comes to number value if you have:

1,2,3,4,5,6,7,8,9,10,11,12,13

Then computers actually order it:
1,10,11,12,13,2,3,4,5,6,7,8,9Just how it works. If you have used a number field for the price. Try making it a string and try actually including the $ sign to force string sorting but you may have the same issue.

[higgeldy-piggeldy]

Thanks Liam,

Yep, it's a string already and inputting the dollar sign gives us the same ordering result.

But you've given me an idea for some additional "ugly liquid hacking" I can try!!