jquery-plugins - 当 JSON 为数据源时,在 jquery 数据表列中显示图像

标签 jquery-plugins datatables

我正在使用 JQuery 数据表插件来显示类(class)中的学生列表。插件的数据源设置为服务器端操作,它将返回一个包含这些属性(名字、姓氏、年龄、性别....)的 json 对象。我们的要求最近更改为显示基于学生性别的图像(男性/女性)。

我可以加载所有数据,以我想要的方式格式化表格,然后将其转换为 DataTable,但这是不可能的,因为我们有很多记录并且我们正在使用分页。

数据表插件中是否有任何可以进行后期渲染的功能?

最佳答案

使用 mRender option

数据表文档中的代码

$(document).ready(function() {
  $('#example').dataTable( {
    "aoColumnDefs": [
        {
            // `data` refers to the data for the cell (defined by `mData`, which
            // defaults to the column being worked with, in this case is the first
            // Using `row[0]` is equivalent.
            "mRender": function ( data, type, row ) {
                return data +' '+ row[3];
            },
            "aTargets": [ 0 ]
        },
        { "bVisible": false,  "aTargets": [ 3 ] },
        { "sClass": "center", "aTargets": [ 4 ] }
     ]
    } );
} );

链接到工作示例 here

编辑:实现此目的的另一种方法是使用 Daniel 指出的“fnRowCallback”。用这个 link :)

干杯!!

关于jquery-plugins - 当 JSON 为数据源时,在 jquery 数据表列中显示图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12890049/

相关文章:

javascript - 将选项数组传递给 jquery 插件

javascript - 将功能封装在 jQuery 插件或 vanilla JavaScript 函数中哪个更好?

jquery dataTables - 创建具有静态内容的列

datatables - 清理 bStateSave cookie

jquery - 特定于案例的 Bootstrap 日期选择器配置

jquery - 为什么我的 JQuery 插件没有获得它自己的实例?

javascript - jQuery 自动完成最小长度

ajax - Datatables 1.10.5 ajax 错误处理程序 - 访问 http 状态代码

jquery - 重定向数据表中的 `sAjaxSource`并重绘

css - 我正在使用数据表,需要添加箭头以按列水平滚动