DataTable根据获取的值创建一列的过程

在dataTable的初始化里面通过一个回调函数实现

    $(document).ready(function() {
                var tableId = "answerpaperTable";
                // 构造DataTable
                var table = $('#'+tableId).dataTable ({
                    "processing": true, // 显示处理进度
                    "serverSide": true, // 从服务端获取数据
                    "rowId" : 'id',// 设置列为id
                    "ajax": {
                        "url": "${pageContext.request.contextPath}/answerpaper/list", // 请求列表数据的url
                        "type": "GET" // http方法
                    },
                    
                    'order':[ [2,'asc'] ],
                    "columns": [
                        { "data": "id" , "orderable" : false}, // ajax返回的json数据中,data数组对象的属性
                        { "data": "description"},
                        { "data": "startTime"},
                        { "data": "endTime"},
                        { "data": "score","orderable":false},
                        { "data": "state" , "orderable" : false},
                         // 下面在操作列中添加了修改和删除按钮
                        {
                            //在这里我需要根据一个时间来显示不同的按钮,所以在创建时defaultContent就不显示,设置为'"'
                            "data": null , "orderable" : false,"defaultContent":"",
                                //已经创建的列的回调函数
                                'createdCell':function(td, cellData, rowData, row, col){
                                    if (rowData.endTime != null) {
                                        //jquery的在一个标签中追加一个标签的方法
                                        $(td).append($("<a class='btn btn-primary btn-xs' name='check'>查看</a>"));
                                    }else{
                                        $(td).append($("<a class='btn btn-primary btn-xs' name='answer'>答题</a>"));
                                    }
                                }

                        }]
                });
           });

这样我们就可以根据获取的值在datatable中显示不同的内容了。

参考了一位博主的分享:https://blog.csdn.net/guoxinjie17/article/details/80342329

猜你喜欢

转载自blog.csdn.net/sinat_38708970/article/details/82748223