JavaScript Tabulator在日期列中未对时间进行排序。

huangapple go评论62阅读模式
英文:

Javascript Tabulator isn't sorting the times in the dates column

问题

数据库中的日期时间按如下方式排序:

Wed, 21 Jun 2023 19:03:11 GMT

现在我正在使用 Tabulator 按日期排序,但它忽略了时间,不按时间排序。

例如:

Thu, 22 Jun 2023 00:26:17 GMT
Thu, 22 Jun 2023 00:30:46 GMT
Thu, 22 Jun 2023 00:33:39 GMT
Thu, 22 Jun 2023 00:33:41 GMT
Thu, 22 Jun 2023 00:36:17 GMT
Thu, 22 Jun 2023 00:36:26 GMT
Thu, 22 Jun 2023 01:06:16 GMT

如您所见,它是颠倒的,并且应该按时间排序,使最新的日期时间出现在表格顶部。我尝试将排序器添加到“datetime”,但那只是完全破坏了排序。我理解它需要我提供某种格式,如 %x%y%w% 等,但我不确定我的日期时间是以哪种格式表示的。

非常感谢您的帮助。

我的排序代码:

initialSort:[
    {column:"date", dir:"asc"},
],
columns:[
    // datetime 列的排序参数,格式如 Thu, 22 Jun 2023 00:26:17 GMT
    {title:"Date", field:"date", editor:"output"}, //我尝试了 sorter:"datetime",但它破坏了表格,我认为它需要额外的信息,比如格式
]
英文:

so the datetime is sorted in my database like so:

Wed, 21 Jun 2023 19:03:11 GMT

Now I am using tabulator sorting by the date, however, it is ignoring the times and not sorting by the time.

For example:

Thu, 22 Jun 2023 00:26:17 GMT
Thu, 22 Jun 2023 00:30:46 GMT
Thu, 22 Jun 2023 00:33:39 GMT
Thu, 22 Jun 2023 00:33:41 GMT
Thu, 22 Jun 2023 00:36:17 GMT
Thu, 22 Jun 2023 00:36:26 GMT
Thu, 22 Jun 2023 01:06:16 GMT

As you can see it's upside down and should be sorting by the time too making the latest date time on top of the table. I have tried adding the sorter to "datetime" but that just broke the sorting completely. I understand it wants some kind of format off me like %x%y%w% etc but I'm not sure what format mine is in terms of that format.

Help is much appreciated.

My code for sorting:

initialSort:[
                {column:"date", dir:"asc"},
            ],
            columns:[                 //define the table columns
                //sorter params for datetime column in this format Thu, 22 Jun 2023 00:26:17 GMT
                {title:"Date", field:"date", editor:"output"}, //I have tried sorter:"datetime" but it broke the table as i think it wants additional info like the format

答案1

得分: 0

你可以使用一个自定义排序器,但在你的情况下,也许你只需使用dir: "desc"而不是dir: "asc"?因为你展示的列表似乎已经排序好了。

以下是如何定义和使用自定义排序器的示例。正如你所看到的,这种格式很容易解析为一个Date对象,这使我认为Tabulator应该能够处理它。

var str = "Wed, 21 Jun 2023 19:03:11 GMT";
var date = new Date(str);
console.log(date)

var column = {
  title: "Date",
  field: "date",
  sorter: function sorter(a, b, aRow, bRow, column, dir, sorterParams) {
    var date_a = new Date(a)
    var date_b = new Date(b)
    var diff = date_a.getTime() - date_b.getTime();
    return dir == "asc" ? diff : -diff;
  }
}

希望这可以帮助你实现你想要的排序功能。

英文:

You can use a custom sorter, but in your case maybe you just want to use dir: "desc" instead of dir: "asc" ? because the list you showed seems to be sorted.

Here's how you can define and compare using a custom sorter. As you can see, this format is easily parsed to a Date object, which makes me think Tabulator should be able to handle it.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

var str = &quot;Wed, 21 Jun 2023 19:03:11 GMT&quot;;
var date = new Date(str);
console.log(date)

var column = {
  title: &quot;Date&quot;,
  field: &quot;date&quot;,
  sorter: function sorter(a, b, aRow, bRow, column, dir, sorterParams) {
    var date_a = new Date(a)
    var date_b = new Date(b)
    var diff = date_a.getTime() - date_b.getTime();
    return dir == &quot;asc&quot; ? diff : -diff;
  }
}

<!-- end snippet -->

huangapple
  • 本文由 发表于 2023年6月22日 07:31:26
  • 转载请务必保留本文链接:https://go.coder-hub.com/76527750.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定