jQuery tablesorter custom date format

♀尐吖头ヾ 提交于 2020-01-24 12:36:10

问题


I currently use Tablesorter (a jQuery plugin) to sort a table. I'm trying to sort date in the yyyy MMM dd format but it appears that im not able to do this. I need to say that my date inputs are in french like so :

  • 2014 janv. 05
  • 2013 févr. 03
  • 2011 mars 02

I tried a lot of things but it just don't sort the right way. I don't know if it's because my date inputs or in french or whatever but i'm about to give it up on this.

Here's the code I used

$.tablesorter.addParser({
            id: "date",
            is: function (s) {
                return false;
            },
            format: function (s, table) {
                var date = s.split(' ');
                var month = translateMonth(date[1]);

                var d = new Date(date[0], month, date[2]);
                console.log(d.toString());

                return d.getTime();
            },
            type: "numeric"
        });

And

$("#table").tablesorter({
            headers: {
                2: {
                    sorter: 'date'
                }
            }
        });

And

function translateMonth(month) {
             switch (month) {
                 case "janv.": return 0;
                 case "févr.": return 1;
                 case "mars": return 2;
                 case "avril": return 3;
                 case "mai": return 4;
                 case "juin": return 5;
                 case "juil": return 6;
                 case "août.": return 7;
                 case "sept.": return 8;
                 case "oct.": return 9;
                 case "nov.": return 10;
                 case "déc.": return 11;
                 default: return -1;
             }
         }

my years and my days are sorted correctly but the problem here are my months

I would appreciate any kind of help

Thanks - S


回答1:


You're right, it doesn't know what those month abbreviations are. There are date libraries out there that can support that kind of thing, such as moment.js which is a great tool if you're able to use jquery. If not, then just convert your abbreviations to the appropriate month digit.

function translateMonth(month)
{
 switch (month)
 {
    case 'janv.': return 0;
    case 'févr.': return 1;
    case 'févr.': return 2;
    case 'mars': return 3;
    case 'avril': return 4;
    case 'mai': return 5;
    case 'juin': return 6;
    case 'juil.': return 7;
    case 'août': return 8;
    case 'oct.': return 9;
    case 'nov.': return 10;
    case 'déc.': return 11;
    default: return -1;
 }
}

$.tablesorter.addParser({
    id: "customParser",
    is: function (s) {
        return false;
    },
    format: function (s) {
        var date = s.split(' '),
            month = translateMonth(date[1]);
        if(month >= 0)
          return new Date(date[0], month ,date[2]).getTime();
        else
          return new Date().getTime();
    },
    type: 'numeric'
});



回答2:


Alright I found it. My javascript file was not updated. Secondly, I used my cells attributes to get a conventional date. And yes.. the real problem here, was that I had to deal with collapsible rows.

my code :

$(function () {

            $.tablesorter.addParser({
                id: "date",
                is: function (s) {
                    return false;
                },

                type: "text",
                format: function (s, table, cell, cellIndex) {
                    var tr = $(cell).parent("tr");
                    var date = tr.data("date");
                    var id = tr.data("id");
                    var ind = tr.data("ind");

                    return date + " " + id + " " + ind;
                }
            });

            $("table").tablesorter({
                headers: { 2: {  sorter: "date" }
                },
                sortList: [[1, 0]],
                widgets: ['group', 'filter'],
                widgetOptions: {
                    group_collapsible: true,
                    group_collapsed: false,
                    group_count: false,
                    filter_childRows: false,
                }
            });
        });

        $(".open-supp").click(function (e) {
            var detail = $(this).closest("tr").next("tr.supp");
            $("tr.supp").not(supp).hide();
            detail.toggle("fast");

            e.preventDefault();
        });

Thanks



来源:https://stackoverflow.com/questions/21247202/jquery-tablesorter-custom-date-format

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!