Issue with sorting in generated tables

I have a table generated by Wappler, and I can sort by header.

image

If I decide to format the value like this

image

then I lose the ability to sort that column. It just doesn’t work.

image

Should it work or not?

Have you chosen the columns specifically in your database query? So not just *

Yes @George, I remembered that from some time ago.

image

This is how the table headings look

<th class="sorting" dmx-on:click="query1.set('sort','job_in_storage == 294 ? 'yes' : null');query1.set('dir',query1.data.dir == 'desc' ? 'asc' : 'desc')" dmx-class:sorting_asc="query1.data.sort=='job_in_storage == 294 ? 'yes' : null' && query1.data.dir == 'asc'" dmx-class:sorting_desc="query1.data.sort=='job_in_storage == 294 ? 'yes' : null' && query1.data.dir == 'desc'">Job in storage</th>

I even replaced the unescaped ‘yes’ with the original variable ‘job_in_storage’ to ensure no escaping was required and got the same result…

<th class="sorting" dmx-on:click="query1.set('sort','job_in_storage == 294 ? job_in_storage : null');query1.set('dir',query1.data.dir == 'desc' ? 'asc' : 'desc')" dmx-class:sorting_asc="query1.data.sort=='job_in_storage == 294 ? job_in_storage : null' && query1.data.dir == 'asc'" dmx-class:sorting_desc="query1.data.sort=='job_in_storage == 294 ? job_in_storage : null' && query1.data.dir == 'desc'">Job in storage</th>

And on the same theme, I cannot sort with ‘alias’ as mentioned here

This does not make sense to be honest.
The sorting mechanism just needs the column name on which the data should sort.
So it should just be:

<th class="sorting" dmx-on:click="query1.set('sort','job_in_storage');query1.set('dir',query1.data.dir == 'desc' ? 'asc' : 'desc')"

This looks like a simple generator issue.

Hi @sid, you are right for the sort, but the other two lines of code are change of class="" which displays the green arrow for direction.

image

You will have to fix those two bindings also.

Hi @sid, even if I strip things back to the bare minimum I am still getting the errors. In other words, if I want to sort columns I cannot use conditions in my expressions and I cannot use alias either.

Have you tried to do this?

Cheers

I haven’t tried this myself. But if you can share the html you have right now, I can probably try to find if there’s any issue with thay.

Don’t add any formatting to the dynamic table when selecting the columns in the UI.
Setup your table and sorting options just as your default columns values are added and then apply formatting to the values on the page, after the table is generated.

Morning @Teodor, I have tried as per your suggestion, in fact that is how I approached it in the first instance.

I have gone back to basics and still cannot get it to sort using an expression like this…

dmx-on:click="query1.set('sort','job_in_storage == 294 ? job_in_storage : null');query1.set('dir',query1.data.dir == 'desc' ? 'asc' : 'desc')"

Is the expression wrong or should I be going about it in a totally different way?

My idea in simple terms is this (hope it makes sense)

What i mean is not to mess with this expression at all … leave it as it is. If you want to format the data in the cells, then format it there, not in the onclick expression.

OK, I have tried that, again in basic form, but the sort is still based on the original results from the query.

I think I need to go back to the original database query and rework it so that the results are presented as per column 2 above and not as per column 1.

I assume (now that my brain is clicking into gear) that the ‘sort’ always uses the original query data and not from the data from the table.

Yes, it sorts your query results, not the data as displayed(formatted) in the table.

1 Like

OK, so to get this to work I have replaced the Database Query in Wappler with a ‘VIEW’ in phpMyAdmin/MySql database replacing part of the SELECT Statement

tbl_job.job_in_storage,

with

IF(tbl_job.job_in_storage = 294, tbl_job.job_in_storage, NULL) job_in_storage, 

I went to the Database Manager and Refreshed the Schema.

I then created a Database Paged Query in Wappler using the VIEW as my table in the Database Query Builder. I selected all the columns as required to build a basic SELECT Query.

This now gives me the results that I want. Thanks Teodor :smile: