从数据表的上一行获取特定列的文本 [英] Get the text of a specific column from the previous row of a datatable
问题描述
我显示一个数据表，我想知道第一列上一行的值(也是文本).如果相同，我想退货'';而不显示它，而不显示文本.
var table = $('< table class =" display" id =" ecolePubArchTable" width =" 100％"');"ajax":{"URL":"/Publicite/ChargerListePubArchEcole?EcoleCode ="+ rowData.ecoleCode +"，"type":"GET"，"datatype":"json"}，列":[{数据:空，标题:"Titre de la composition"，类别:"progNomClass"，数据:空，标题:"Titre de la composition"，类别:"progNomClass"，渲染:函数(数据，类型，行，元){//var selector_modifier = {顺序:当前"，页面:当前"，搜索:已应用"}var textRow =";var tbl = $(#ecolePubArchTable").DataTable();var previous ='';var schoolNodes = tbl.column(0).nodes();var schoolData = tbl.column(0).data();对于(var i = 0; i< schoolData.length; i ++){var current = schoolData [i];console.log(i +''+ current);如果(当前===上一个){textRow ='';} 别的 {textRow =当前+'('+ row.prog_code +')';}返回''+ textRow +'';//上一个=当前；}}}} 这里是一种方法，它对以下各项进行迭代:
- 特定列中的HTML表节点
- 同一列的等效DataTable单元格值
代码使用基础DataTable对象中的单元格值查看值何时更改.然后，它将使用该信息来更改相关的HTML表节点值(您看到的显示在HTML中的值).
因此，虽然基础DataTable值从不更改，但HTML值会进行调整.
此外，我们使用
因为我们将值隐藏在HTML表节点中，所以诸如排序和过滤之类的功能不会受到影响(原始值仍按最初加载的方式存储在DataTables中).
说明:出于测试目的，我在JavaScript变量中提供了数据:
var dataSet = {数据":[{"id":"1"，名称":尼克松"，"position":"System Architect"，薪金":"320,800美元"，" start_date" ;:" 2011/04/25" ;，办公室":爱丁堡"，"extn":"5421".}，...{"id":"12"，名称":"Quinn Flynn"，"position":"Support Lead"，薪水":"$ 342,000"，"start_date":"2013/03/03"，办公室":爱丁堡"，"extn":"9497".}]}; I display a datatable and I want to know the value (which is also the text) of the previous row of the 1st column. If it is the same I want to make a return ''; and not display it instead of displaying the text.
var table = $('<table class="display" id="ecolePubArchTable" width="100%"/>');
"ajax": {
"url": "/Publicite/ChargerListePubArchEcole?EcoleCode=" + rowData.ecoleCode + "",
"type": "GET",
"datatype": "json"
},
"columns": [
{
data: null,
title: "Titre de la formation",
class: "progNomClass",
data: null,
title: "Titre de la formation",
class: "progNomClass",
render: function (data, type, row, meta) {
//var selector_modifier = { order: 'current', page: 'current', search: 'applied' }
var textRow = "";
var tbl = $("#ecolePubArchTable").DataTable();
var previous = '';
var schoolNodes = tbl.column(0).nodes();
var schoolData = tbl.column(0).data();
for (var i = 0; i < schoolData.length; i++) {
var current = schoolData[i];
console.log(i + ' ' + current);
if (current === previous) {
textRow = '';
} else {
textRow = current + ' (' + row.prog_code + ')';
}
return '' + textRow + '';
//previous = current;
}
}
}
}
Here is one approach, which iterates over the following items:
- the HTML table nodes in a specific column
- the equivalent DataTable cell values for the same column
The code uses the cell values from the underlying DataTable object to see when a value changes. It then uses that information to change the related HTML table node value (what you see displayed in the HTML).
So, whereas the underlying DataTable values are never changed, the HTML values are adjusted.
Also, we use a selector modifier, which instructs the tbl.column() function how to handle sorted and filtered data. Basically, we only operate on the data which is visible to the user.
function processColumnNodes(tbl) {
// see https://datatables.net/reference/type/selector-modifier
var selector_modifier = { order: 'current', page: 'current', search: 'applied' }
var previous = '';
var officeNodes = tbl.column(1, selector_modifier).nodes();
var officeData = tbl.column(1, selector_modifier).data();
for (var i = 0; i < officeData.length; i++) {
var current = officeData[i];
if (current === previous) {
officeNodes[i].textContent = '';
} else {
officeNodes[i].textContent = current;
}
previous = current;
}
}
In the above example, I am accessing column index 1 (the 2nd column in the table - so, slightly different from your question).
This function can be used as follows, with two DataTables events:
initComplete- for the initial drawing of the table- subsequent
drawevents
var table = $('#example').DataTable( {
data: dataSet.data,
"order": [[ 1, 'asc' ]], // just as a test for the initial draw
columns: [
{ title: "Name", data: "name" },
{ title: "Office", data: "office" }, // values will be hidden
{ title: "Office2", data: "office" }, // values will not be hidden, for verification
{ title: "Position", data: "position" },
{ title: "Start date", data: "start_date" },
{ title: "Salary", data: "salary" }
],
"initComplete": function(settings, json) {
// in case the initial sort order leads to
// cells needing to be altered:
processColumnNodes( $('#example').DataTable() );
}
} );
table.on( 'draw', function () {
processColumnNodes( $('#example').DataTable() );
} );
function processColumnNodes(tbl) {
// see https://datatables.net/reference/type/selector-modifier
var selector_modifier = { order: 'current', page: 'current', search: 'applied' }
var previous = '';
var officeNodes = tbl.column(1, selector_modifier).nodes();
var officeData = tbl.column(1, selector_modifier).data();
for (var i = 0; i < officeData.length; i++) {
var current = officeData[i];
console.log( i + ' ' + current );
if (current === previous) {
officeNodes[i].textContent = '';
} else {
officeNodes[i].textContent = current;
}
previous = current;
}
}
An example of the result, where I have also included "Office 2", showing the original unchanged node data, for comparison:
Because we are hiding values in the HTML table nodes, functions such as sorting and filtering are not affected (the original values are still stored in DataTables, as originally loaded).
Clarification: For testing purposes I provided my data in a JavaScript variable:
var dataSet = {
"data": [
{
"id": "1",
"name": "Tiger Nixon",
"position": "System Architect",
"salary": "$320,800",
"start_date": "2011/04/25",
"office": "Edinburgh",
"extn": "5421"
},
...
{
"id": "12",
"name": "Quinn Flynn",
"position": "Support Lead",
"salary": "$342,000",
"start_date": "2013/03/03",
"office": "Edinburgh",
"extn": "9497"
}
]
};
这篇关于从数据表的上一行获取特定列的文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
