list.js
list.js copied to clipboard
Sorting is not working correctly
Hi! I am new to list.js. It seems easy to use and does what I need. I am running in to a weird problem, however, and I'm not sure why.
When I sort, it works on all columns except for a couple, which sorts the entire list correctly except the first couple cells. Maybe there's a weird thing about the character or data or something, but I'm looking at the original file, the input data, the data how it reads on the screen, and it all seems to be fine. Take a look at my site here: https://goo.gl/vKvVyv. Try clicking the headers to sort by column. They all work fine, except for the Commitment and Paid to Date fields, which do something like this:
In "descending" order: $450 $900 $16,000 $15,500 $15,400 $15,200... and so on
Why are my first couple values not sorted properly?
Thanks! BDPARKER
Ok, I know why, but I still need a solution.
It's treating the numbers with commas (ie. 16,000) as decimals (so it sees it as 16) and sorts it accordingly. Therefore, $15,500 is less than $400 becuase it sees it as $15.5. How do I fix this? It's doing it with all my columns.
Here's a real example from my site: 18.75% 14.88% 12.70% 5,000.00% 2.89% 1.56%
Hi
An easy way to sort as number by list.js is defining 'data-xxx' attribute in your data of TD. You can use two types of string, displaying for human and sorting for list.js.
<tr>
<td class='id_name'>002, Blessed Sacrament </td>
<td class='id_town'>Rochester </td>
<td class='id_give'>107</td>
<td class='id_comm'>$35,862.00</td>
<td class='id_paid'>$34,904.00</td>
<td class='id_goal'>$73,822.00</td>
<td class='id_perc' data-perc='0.4858'>48.58%</td>
</tr>
In addition, you have to change your js code as follows.
<script>
var options = {
valueNames: [ 'id_name', 'id_town', 'id_give', 'id_comm', 'id_paid', 'id_goal',
//'id_perc'
{ name: 'id_perc', attr: 'data-perc' }, //*here
],
};
var tableList = new List('tableID', options);
</script>
Best, Kanaxx
Thanks, I gave it a try. It did not work for me, though. Instead of sorting incorrectly (and seeing commas as decimals), it didn't sort at all. I replaced the 'id_perc' so that it looks like this:
var options = { valueNames: [ 'id_name', 'id_town', 'id_give', 'id_comm', 'id_paid', 'id_goal', { name: 'id_perc', attr: 'data-perc' } ] }; var tableList = new List('tableID', options);
Another thing, I ran a script to change all commas "," to something else, like a weird character, a "'" or anything else. It does the same thing. It's like it sees the first non-numeric character as a decimal and treats it as such. If I get rid of the character (so that it reads $52586.90, for example), it sorts just fine, but I can't have that.
@bdparker let me show you my example, https://kanaxx.github.io/listjs/number-sort.html
Commitment and Percent have other value for sorting, data-comm and data-perc. You have to make with data-xxx into all TD column and make a data-xxx's value with only decimal character. Paid to Date and Goal don't have data-xxx attribute and values so these column sort don't work fine.