tochoromero / aurelia-table

Simple functional data table for Aurelia
https://tochoromero.github.com/aurelia-table
MIT License
67 stars 25 forks source link

Can't apply default sorting to dynamic columns #48

Closed raffaele-clevermind closed 6 years ago

raffaele-clevermind commented 7 years ago

Hi,

We're trying to make a table with dynamic columns; we managed to handle a dynamic sorting function, but we can't find a way to bind the "default" sorting. Here is our current DOM:

<th repeat.for="oColumn of columns" aut-sort="custom.bind: getSortingFunction( oColumn ) ;">

We tried to bind the default sorting like this:

<th repeat.for="oColumn of columns" aut-sort="custom.bind: getSortingFunction( oColumn ) ; default: oColumn.order">

and like this:

<th repeat.for="oColumn of columns" aut-sort="custom.bind: getSortingFunction( oColumn ) ;${ oColumn.order ? 'default:' + oColumn.order : ''}">

But neither work. Is there a way to implement the desired functionality?

Thanks, Raffaele

dereke55 commented 6 years ago

I am having a similar issue:

To simplify, I was attempting to add dynamic sorting to the first column, but the string interpolation was throwing an error:

<template repeat.for="header of headers">
    <th if.bind="$first" aut-sort="key: ${header.value}">${header.name}</th>
    <th if.bind="!$first">${header.name}</th>
</template>

Being explicit works fine:

<template repeat.for="header of headers">
    <th if.bind="$first" aut-sort="key: dimension">${header.name}</th>
    <th if.bind="!$first">${header.name}</th>
</template>
dereke55 commented 6 years ago

I don't completely understand it, but it looks like there was an issue with referencing of the component. It seems to work if you add ref="referenced"

<template repeat.for="header of headers">
    <th if.bind="$first" ref="referenced" aut-sort="key: ${header.value}">${header.name}</th>
    <th if.bind="!$first">${header.name}</th>
</template>

@raffaele-clevermind - see if that works for your situation

alexdrenea commented 6 years ago

having the same issue, the ref="referenced" did not help in my case.

raffaele-clevermind commented 6 years ago

@alexdrenea @dereke55 i think i found a really simple solution. All i had to change in the cusom attributed was "the property"; so from :

<th repeat.for="oColumn of columns" aut-sort="custom.bind: getSortingFunction( oColumn ) ; default: oColumn.order">

now it looks like

<th repeat.for="oColumn of columns" aut-sort="custom.bind: getSortingFunction( oColumn ) ; default.bind: oColumn.order">

I just nedded to specify the fact that instead of a string the default sort had to reference a variable