我有显示details rows的数据表。第一次工作正常,但是当我单击第二或第三子行时,它显示重复的行,是指第一子行中的行。
render(){
const {
attributes : {
id,
name,
dataType,
rules,
} = {},
displayError,
obj,
errorStatus
} = this.props;
return(
<div className="input-container">
<Input
type = {dataType}
id = {id.toString()}
name = {name || ''}
value = {obj[name]}
error={displayError || errorStatus[name] ? false : true} />
</div>
)
}
我做了 $(document).ready(function() {
var table = $('#example').DataTable( {
"ajax": {
"url":"{{ route('admin.requestReport') }}",
"dataType":"json",
"type":"POST",
"data":{"_token":"{{ csrf_token() }}"}
},
"columns": [
{
"className": 'details-control',
"orderable": false,
"data": null,
"defaultContent": ''
},
{ "data": "counter" },
{ "data": "start_date" }
],
/* "order": [[1, 'asc']], */
searching: false
} );
// Add event listener for opening and closing details
$('#example tbody').on('click', 'td.details-control', function () {
var tr = $(this).closest('tr');
var row = table.row( tr );
if ( row.child.isShown() ) {
// This row is already open - close it
row.child.hide();
tr.removeClass('shown');
}
else {
// Open this row
row.child( format(row.data()) ).show();
tr.addClass('shown');
}
} );
} );
并发现了问题,但是我需要指导方针来解决它。我发现的问题在这里
console.log()
我做了else {
// Open this row
row.child( format(row.data()) ).show();
tr.addClass('shown');
}
,它也将先前单击的行传递给函数。
我想请您指导我如何将单行的data()传递给函数。我很感激。非常感谢。