Allow User to sort data on site via "clicking" on column header

Ask the community
, ,
1

Hello,

I am extremely new to this and have extremely limited coding experience. Most of my ocding is copying, pasting and editing the pertient bits to suit my needs.

I have so far figured out how CMS works to import tables into my site, and how to sort them as I wish to see them. However now i want to add the function of allowing site users to sort the data (not filter) on their chosen column.

So far I have added an invisible button above each column header I want them to be able to sort and I thought the code I entered below might work, however as I am here, you can imagine it didnt.

import wixData from “wix-data”;

export function button1_click(event) {

import wixData from “wix-data”;

$w(“#table1”).setSort(

wixData.sort().ascending(“K/D”).descending(“Name”),

);
}

As I said, totally new to this and coding isn’t something I’m overly experienced in.

2

First, start by tagging your buttons so they’re not #button1, #button2, etc.

#titleHeader, #priceHeader for example (Whatever you feel is good to distinguish)

I don’t see a setSort() function available for $w.Table, did you see it documented somewhere?

In order to sort data, you need to connect your table to a dataset (anyone reading this, please correct me if I’m wrong)

After you set up a database collection, and connect a dataset to the table, you can use this function:

    $w('#dataset').setSort(wixData.sort().ascending('fieldName'))

You can see a demo here, the sorting is made by selecting fields and not by clicking the headers, but you can use the code as reference