[英]JQuery datatables adding column classes to dynamic content
我有一个具有动态列的数据表
<table id="dt_basic" width="100%" class="table table-striped table-bordered table-hover tableSearch">
<thead>
<tr>
@foreach (var item in Model.ColumnInfo) {
<th>@Html.Raw(@item.ColumnHeader) </th>
}
<th>Edit</th>
</tr>
</thead>
<tbody></tbody>
</table>
我想在填充数据表后设置列类型和列类
var table = $('#dt_basic').dataTable({
"pagingType": "full_numbers",
"ajax": "@Url.Action("LoadResultGrid", "Verifications", new { id = Model.RunId })",
"deferRender": true,
"bProcessing": true,
"scrollX": "100%",
"columnDefs": [
{
"targets": [0],
"visible": false,
"searchable": false
},
{
"targets": [1],
"searchable": true,
"visible": true
}
]
});
Model.ColumnInfo是具有以下属性的对象的列表:ColumnHeader,ColumnType,ColumnClass。
因此,我需要在创建表之后遍历各列,并将列标题与Model.ColumnInfo.ColumnHeader匹配,然后将列类型设置为相应的Model.ColumnInfo.ColumnType,并将列类设置为相应的Model.ColumnInfo。 CoulmnClass。
任何帮助,将不胜感激。 谢谢。
我已经弄清楚了如何解决我的问题,并认为如果其他人遇到类似问题,我会与他人分享。
我添加了剃刀代码以生成将clasName属性动态添加到columndefs的javascript。
var table = $('#dt_basic').dataTable({
"pagingType": "full_numbers",
"ajax": "@Url.Action("LoadResultGrid", "Verifications", new { id = Model.RunId })",
"deferRender": true,
"bProcessing": true,
"scrollX": "100%",
"columnDefs": [
{
"targets": [0],
"visible": false,
"searchable": false
},
@for(var i = 0; i < (Model.ColumnHeaders.Count); i++){
if (Model.ColumnHeaders[i].ColumnClass != null)
{
@: {"targets": [@i], "className": "@Model.ColumnHeaders[i].ColumnClass"},
};
}
]
});
解决的javascript代码段:
"columnDefs": [
{
"targets": [0],
"visible": false,
"searchable": false
},
{"targets": [5], "className": "do_rightalign"},
{"targets": [6], "className": "do_rightalign"},
{"targets": [7], "className": "do_rightalign"},
{"targets": [8], "className": "do_rightalign"},
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.