I'm using footable library for showing table. Each row has a Date column, I would like to sort this table by the Date column (on column header click).
<table class="footable table table-stripped toggle-arrow-tiny">
<thead>
<tr>
<th data-type="date-eu">Data Scadenza</th>
<th>Titolo</th>
<th>Inviato da</th>
<th>Link</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="promemoria in elencoPromemoria">
<td>{{promemoria.DataScadenza | date:"dd/MM/yyyy"}}</td>
<td>{{promemoria.Titolo}}</td>
<td>{{promemoria.InviatoDa}}</td>
<td><a ng-show="promemoria.Link" ng-attr-ui-sref="{{promemoria.Link || false}}"><i class="fa fa-search-plus"></i></a></td>
</tr>
</tbody>
The variable promemoria.DataScadenza contains a date in the format yyyy-mm-dd so:
{{promemoria.DataScadenza | date:"dd/MM/yyyy"}} I can see the date in the right euro-zone (dd/mm/yyyy) style but I can't sort correctly.{{promemoria.DataScadenza}} I can sort correctly but I see the dates in the USA-zone (yyyy-mm-dd) style.PS: The other two columns (Titolo,InviatoDa) are sorted alphabetically and working fine.
You can use data-format-string attribute in the table header to define custom format for data.
Below is redefined version of your code
<table class="footable table table-stripped toggle-arrow-tiny">
<thead>
<tr>
<th data-type="date" data-format-string="dd/MM/yyyy">Data Scadenza</th>
<th>Titolo</th>
<th>Inviato da</th>
<th>Link</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="promemoria in elencoPromemoria">
<td>{{promemoria.DataScadenza | date:"dd/MM/yyyy"}}</td>
<td>{{promemoria.Titolo}}</td>
<td>{{promemoria.InviatoDa}}</td>
<td><a ng-show="promemoria.Link" ng-attr-ui-sref="{{promemoria.Link || false}}"><i class="fa fa-search-plus"></i></a></td>
</tr>
</tbody>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With