У меня есть две таблицы, и я работаю с Datatables, и я хотел бы использовать дочернюю строку, чтобы показать больше информации о конкретной строке. Например, в таблице я буду отображать имя, фамилию, имя пользователя и адрес электронной почты, а в дочерней или расширяемой строке я покажу национальность этого пользователя.
Проблема, с которой я сталкиваюсь, заключается в том, что, когда я раскрываю строку, она показывает только идентификатор из таблицы «Пользователь», а не описание, связанное с этим идентификатором.
я впервые имею дело с Datatables, поэтому у меня нет с этим опыта.
Есть предложения по решению этой проблемы?
db.define_table('User',
Field('first_name', 'string'),
Field('last_name', 'string'),
Field('email','string'),
Field('username','string'),
Field('nationality','reference Nationality', requires = IS_IN_DB(db,db.Nationality.id,'%(description)s')
)
db.define_table('Nationality',
Field('description','string'),
format = '%(descripcion)s'
)
Мой контроллер
def user():
import json
usuario = json.dumps(db(db.auth_user.id>0).select().as_list())
return dict(formListar=XML(usuario))
// вид //
<script>
var tabla;
$(document).ready(function(){
tabla= $('#tablaGenerica').DataTable({
"data": {{=formListar}},
"scrollX": false,
"dom": 'lrtip',
"searching": true,
"sRowSelect": "single",
"columns": [
{
"class":"details-control",
"orderable":false,
"data":null,
"defaultContent": ""
},
{ data: 'first_name' },
{ data: 'last_name' },
{ data: 'email' },
{ data: 'username' },
]
});
$('#tablaGenerica tbody').on('click', 'td.details-control', function () {
var tr = $(this).closest('tr');
var row = tabla.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');
}
} );
function format ( d ) {
// `d` is the original data object for the row
return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">'+
'<tr>'+
'<td>Nationality:</td>'+
'<td>'+d.nationality+'</td>'+
'</tr>'+
'</table>';
}
</script>
<table id="tablaGenerica" class="tablaC table-striped hover cell-border" cellspacing="0" width="100%" >
<thead>
<tr>
<th></th>
<th>First name</th>
<th>Last name</th>
<th>Email</th>
<th>Username</th>
</tr>
</thead>
</table>