DataTable如何确定列类型 [英] How DataTables determine columns type

查看:196
本文介绍了DataTable如何确定列类型的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个由jQuery DataTables增强的动态表,它显示一个类似于示例



JSON:

  {
data:[
{
name:Tiger Nixon,
position系统架构师,
salary:$ 320,800,
start_date:{
display:SomeString,
timestamp:1303686000
},
office:爱丁堡,
extn:5421
},
// ... skipped ...
]}

JavaScript:

  $(document).ready(function(){
$('#example')。DataTable({
ajax :data / orthogonal.txt,
列:[
{data:name},
{data:posit离子},
{data:office},
{data:extn},
{data:{
_:start_date.display,
sort:start_date.timestamp
}},
{data:salary}
]
});
});

区别是我动态构建列配置,因为列可以是任何顺序,其他列可以从列表中添加或删除。对于这个例子(我的情况非常类似),问题是由于某些原因, timestamp 属性被排序为一个字符串而不是一个数字。



我发现在将列type设置为number后,排序工作完美。我假定DataTables由于某种原因自动检测列为String(可能是因为显示元素是一个字符串)。



DataTable如何设置列的类型,何时未明确声明?



编辑1



我做了一个示例代码来显示问题
http://jsfiddle.net/Teles/agrLjd2n/16/

解决方案

p> jQuery DataTables具有内置的类型检测机制。 各种类型有多个预定义功能,后备到 string 数据类型。



还可以使用第三方插件或编写自己的。



有多种方式可以指定数据类型,下面只是


解决方案1 ​​


使用 类型 选项。

  $(document).ready(function(){
$('#example' .DataTable({
ajax:data / orthogonal.txt,
列:[
{data:name},
{data:position},
{data:office},
{data:extn},
{data:start_date.di splay,输入:date},
{data:salary}
]
});
});




解决方案2


使用返回的JSON数据进行类型检测,请参见 columns.data 获取更多信息。

  $(document).ready(function(){
$('#example')。DataTable({
ajax:data / orthogonal.txt,
columns: [
{data:name},
{data:position},
{data:office},
{data:extn},
{data:{
_:start_date.display,
sort:start_date.timestamp,
type:start_date.timestamp,
}},
{data:salary}
]
});
});


I have a dynamic table enhanced by jQuery DataTables, which display a custom object similar to this example.

JSON:

{
  "data": [
    {
      "name": "Tiger Nixon",
      "position": "System Architect",
      "salary": "$320,800",
      "start_date": {
        "display": "SomeString",
        "timestamp": 1303686000
      },
      "office": "Edinburgh",
      "extn": "5421"
    },
    // ... skipped ...
]}

JavaScript:

$(document).ready(function() {
    $('#example').DataTable( {
        ajax: "data/orthogonal.txt",
        columns: [
            { data: "name" },
            { data: "position" },
            { data: "office" },
            { data: "extn" },
            { data: {
                _:    "start_date.display",
                sort: "start_date.timestamp"
            } },
            { data: "salary" }
        ]
    } );
} );

The difference is that I dynamically build the columns configuration, because the columns can be in any order, and others columns can be added or removed from the list. For this example (my case is very similar) the problem is that for some reason the timestamp property is ordered as a String instead of being ordered as a number.

I discovered that after setting the column "type" as "number" the ordering works perfectly. I'm presuming that DataTables is auto detecting the column as "String" for some reason (maybe because the display element is a string).

How does DataTables set the type of the columns, when is not explicitly declared?

Edit 1

I made a sample code to show the problem http://jsfiddle.net/Teles/agrLjd2n/16/

解决方案

jQuery DataTables has built-in mechanism for type detection. There are multiple predefined functions for various types with fallback to string data type.

It's also possible to use third-party plug-ins or write your own.

There are multiple ways to specify data type, below are just the few.

SOLUTION 1

Use type option.

$(document).ready(function() {
    $('#example').DataTable( {
        ajax: "data/orthogonal.txt",
        columns: [
            { data: "name" },
            { data: "position" },
            { data: "office" },
            { data: "extn" },
            { data: "start_date.display", type: "date" },
            { data: "salary" }
        ]
    } );
} );

SOLUTION 2

Use returned JSON data for type detection, see columns.data for more information.

$(document).ready(function() {
    $('#example').DataTable( {
        ajax: "data/orthogonal.txt",
        columns: [
            { data: "name" },
            { data: "position" },
            { data: "office" },
            { data: "extn" },
            { data: {
                _:    "start_date.display",
                sort: "start_date.timestamp",
                type: "start_date.timestamp",
            } },
            { data: "salary" }
        ]
    } );
} );

这篇关于DataTable如何确定列类型的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆