场景

某天领导提出要求：

表头文字居中，序号、系统自动编码、有规则约束的编码、码表关联信息显示样式居中，金额、数量等右对齐，其他文字信息左对齐。

在DataTables中如何给每列添加样式。

实现

 columns: [{ data: 'id',className :'badao_Center'},{ data: 'purchaseCode',className :'badao_Center' },{ data: 'deliveryTime',className :'badao_Center' ,render: function (data, type, full, meta ) {return moment(data).format("YYYY-MM-DD ");} },{ data: 'createrName',className :'badao_Center'  },//暂时先用创建人代替{ data: 'supplierCode',className :'badao_Center' },{ data: 'supplierName'  ,className :'badao_Left' },{ data: 'totalTray' ,className :'badao_Right'  },{ data: 'totalNum' ,className :'badao_Right' },{ data: 'deliveryCode',className :'badao_Center' },{ data: 'createrName' ,className :'badao_Center'},{ data: 'gmtCreat',className :'badao_Center' ,render: function (data, type, full, meta ) {return moment(data).format("YYYY-MM-DD");} },{ data: 'status',className :'badao_Center',render: function (data, type, full, meta ) {if(data.trim()=="1"){return '未提交'}else if(data.trim()=="2"){return '已提交'}else if(data.trim()=="3"){return '已打印'}else if(data.trim()=="4"){return '已入库'}else{return '未知状态'}}  },],

通过给columns里的每一列添加className属性。

其中样式名是在当前页面的css文件中定义的。

.badao_Center{text-align: center;vertical-align: middle!important;
}
.badao_Right{text-align: right;vertical-align: middle!important;
}
.badao_Left{text-align: left;vertical-align: middle!important;
}

DataTables中给某列添加样式相关推荐

DataTables中设置某些列不进行排序
场景 dataTables的表格中的列是默认自动带排序的. 现在要设置某些列是不进行排序的,即不显示排序的符号. 实现在js中的$('#wmsReceiveOrder_table_id').Data ...
uni-app中使用rich-text如何添加样式控制富文本里面的内容
第一种控制宽度的方式(这里的res.data.data.maincontent是咱们要放进rich-text里面nodes的变量): this.article.maincontent=res.data ...
使DataGrid中的某些列隐藏起来
先定义样式表 .noneDisplay { display:none; } 绑定数据源的同时在代码中使某些列使用样式表 datagrid1.DataSource=datatable1; datag ...
为网页添加样式（选择器和声明块）
目录简单的选择器 1.id选择器 2.元素选择器 3.类选择器 4.通配符选择器 5.属性选择器 6.伪类选择器 7.伪元素选择器选择器的并列 css代码书写位置常见的样式声明 1.color ...
vue选中点击的元素_vue中v-for循环选中点击的元素并对该元素添加样式操作
相信大家都会遇到这种情况:v-for循环时,我只需要点击到的元素做出相应反应,其他的元素不变:但是往往所有v-for循环出的元素都会变化.如下面的代码:我需要点击到的元素添加一个类样式,其他元素不变, ...
如何用php新增税金一列_根据新税改增加税额，税率时，增加字段保存报错ORA-01430: 表中已存在要添加的列...
版本号:7.0 业务场景(如下): 预期效果(如下): 实际效果(如下)(包括错误,异常): 异常信息(异常类型:System.Exception) 异常提示: 异常信息:添加业务实体的时候出错. 导 ...
R语言使用gt包和gtExtras包优雅地、漂亮地显示表格数据：使用gt包可视化表格数据，使其易于阅读和理解、使用gtExtras包添加一个图，显示表中某一列中的数字
R语言使用gt包和gtExtras包优雅地.漂亮地显示表格数据:使用gt包可视化表格数据,使其易于阅读和理解.使用gtExtras包添加一个图,显示表中某一列中的数字目录
R语言使用gt包和gtExtras包优雅地、漂亮地显示表格数据：使用gt包可视化表格数据，使其易于阅读和理解、使用gtExtras包添加一个图，显示表中某一列中的数字、并为类型数据添加图像符号标签
R语言使用gt包和gtExtras包优雅地.漂亮地显示表格数据:使用gt包可视化表格数据,使其易于阅读和理解.使用gtExtras包添加一个图,显示表中某一列中的数字.并为类型数据添加图像符号标签目 ...
R语言使用gt包和gtExtras包优雅地、漂亮地显示表格数据：使用gtExtras包添加一个图，显示表中某一列中的数字、并自定义表格数据显示的主题格式、并自定义数值数据的格式（例如百分比）
R语言使用gt包和gtExtras包优雅地.漂亮地显示表格数据:使用gtExtras包添加一个图,显示表中某一列中的数字.并自定义表格数据显示的主题格式.并自定义数值数据的格式(例如百分比) 目录

DataTables中给某列添加样式

场景

实现

DataTables中给某列添加样式相关推荐

最新文章

热门文章