Sort Repeater Reference Field data

I have a repeater that is showing tutor profiles from my “Tutors” collections. Each tutor profile has a reference field (planRef) for a subscription plan that is attached, in this case free, bronze, silver or gold (references items in “Plans” collection).

I want to sort the tutor repeater by each profile’s plan level, with gold plans appearing first.

The Editor lets you filter a dataset by a referenced field item, but it won’t let you sort by a referenced field. Is there a code solution?

something like this would work

import wixData from 'wix-data';

wixData.query("MyCollection")
  .ascending("myField") // Use .descending("myField") for descending order
  .find()
  .then((results) => {
    let sortedItems = results.items;
    console.log(sortedItems);
    // You can now use sortedItems in your page, for example, binding them to a repeater.
  })
  .catch((err) => {
    console.error('Error fetching sorted data:', err);
  });

or to do without code you could add another field and manually add the plan type to sort.

You can do the following:

  1. create a string array with the plans in the order you want, i.e. gold first, etc.
  2. Make a query to the collection, filtering by the plan id and run this repeatedly in a loop so that you get all the results. Save each query in an array
  3. Finally assign that array to repeater.data.

Like this:

import wixData from "wix-data";


const plans = ["goldidplan", "silveidplan"];

async function fetchResults() {
    try {
        const queries = plans.map((plan) =>
            wixData.query("myCollection").eq("fieldNameReferencePlan", plan).find()
        );

        const results = await Promise.all(queries);

        const allResultsSorted = results.map((result) => result.items).flat();

        console.log(allResultsSorted);
        return allResultsSorted;
    } catch (err) {
        console.error(err);
    }
}

$w("#repeater").data = await fetchResults();

Let me know if that helps you

Feel free to take a look at some tutorials

Thank you for your responses.

I think both approaches would work if the referenced plan (planRef) field just pointed to the ID of a gold/silver/bronze plan in a 3-item collection. But in this case the reference field is pointing to the unique ID of the customer’s subscription order in my Plans collection, which in turn contains fields for the subscription’s order number, type (gold/silver/bronze), expiry date, etc.

to visualize:
refPlan (Tutors) → _id (Plans): 707b673a-09d1-4e92-a515-4d0764a8731a
type (Plans): gold
level (Plans): 3 // (gold = 3, silver = 2, bronze = 1)
expiryDate (Plans): Dec 31, 2025

The Editor lets you filter a dataset by an item in a reference (yay!), but unfortunately it will not let you sort using an item in a reference (boo!). Seems that can only be done with Velo. Looking for a solution that doesn’t require querying each repeater item’s reference field and can be turned on/off easily.

I know this won’t work, but this is ideally how it would go:

$w("#Tutors").setSort( 
      wixData.sort()
.descending("planRef.level")
    );