jQuery DataTables render简述

前台table绑定数据时,用得比较多的一款jQuery插件就是DataTable了,在展示列的时候有时候会遇到要根据前一列内容展示后一列内容的情况,DataTable也提供了这样的方法--render。

官方api有介绍render,如下:


要使用render参照前一项内容时,要定义在“columnDefs”中,并要在初始化值之后定义,但按照官方给出的直接去使用时会发现页面报错data以及row未定义,正确的使用应当在render中定义data以及row,定义使用的参数即为返回model中你要使用的列。

举个例子:


table第八列要根据返回的model的hasPo决定,render中使用的时候data需定义为hasPo,render定义为一个待返回值的函数,return内容即为展示在table中的内容

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JQuery Datatables 中,渲染器(render)是一种用于修改单元格中数据显示方式的方法。使用渲染器,你可以将列中的数据以特定的方式呈现,例如格式化日期、显示图片等。在使用 Datatables 的时候,你可以将渲染器指定给一列,然后 Datatables 会在呈现表格时自动应用该渲染器。 渲染器是一个 JavaScript 函数,它接收四个参数: ```javascript function(data, type, row, meta) { // data: 单元格中的数据 // type: 描述单元格数据类型的字符串,可能的值为 'display', 'filter', 'sort', 'type' // row: 包含该单元格数据的行的数据对象 // meta: 包含该单元格数据的行和列的元数据对象 } ``` 其中 `data` 参数是单元格中的数据,`type` 参数是一个描述单元格数据类型的字符串。`type` 参数有四种可能的取值: - `display`: 用于在表格中显示的数据。 - `filter`: 用于过滤数据的数据。 - `sort`: 用于排序的数据。 - `type`: 用于定义数据类型的数据。 根据 `type` 参数的不同取值,渲染器可以返回不同的数据格式。例如,如果 `type` 参数为 `display`,渲染器可能会返回一个 HTML 字符串,用于在表格中呈现单元格数据;如果 `type` 参数为 `sort`,渲染器可以返回一个数字或字符串,用于在排序时比较单元格数据。 除了接收参数,渲染器还必须返回一个字符串或 DOM 元素,用于表示单元格中的数据。如果渲染器返回一个字符串,该字符串将显示在单元格中;如果渲染器返回一个 DOM 元素,该元素将作为单元格中的内容。 要为 Datatables 中的列指定渲染器,可以使用 `columnDefs` 选项。例如,以下代码将第一列的渲染器设置为一个将日期格式化为 `YYYY-MM-DD` 的函数: ```javascript $('#example').DataTable( { columnDefs: [ { targets: 0, render: function(data, type, row, meta) { if (type === 'display') { return moment(data).format('YYYY-MM-DD'); } else { return data; } } } ] }); ``` 以上代码使用了 moment.js 库来格式化日期。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值