在我的数据表中,我有一个隐藏列包含了最接近行中数据的当前状态名称,但是当按下输入复选框时,该隐藏列的文本会按以下方式更改:
$("#rBuscarPerfil").on('click','input[type="checkbox"]',function() {
if($(this).is(':checked')) {
$(this).closest('tr').find('td:last').html("Activo");
} else {
$(this).closest('tr').find('td:last').html("Desactivado");
}
........
}
当按下顶部的按钮时,例如:
Active,在dataTable的输入搜索框中放置文本"Activo",并且表格仅显示包含在每行的最后一个td中的结果,即"Activo"单词的结果。
Inactivo,在dataTable的输入搜索框中放置文本,并且仅显示包含在每行的最后一个td中的结果,即"Desactivado"单词的结果。
问题是:搜索仅在打开页面或刷新浏览器时起作用,但如果我选中或取消选中每行中的任何复选框,则最后一个TD中的文本会正确更改。 但似乎表格处于当前状态,不更新其属性,搜索不显示那些更改的结果。
Html代码表
<table cellspacing="1" id="rBuscarPerfil" class="tableResultsSearch" name="rBuscarPerfil">
<thead>
<tr>
<th>NOMBRE</th>
<th>DESCRIPCIÓN</th>
<th>ACCIÓN</th>
<th>STATUS</th>
<th style="display:none;">STATUS2</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
使用JavaScript加载表格内容
if(response.success == "success") {
if(area == "perfil") {
$('#rBuscarPerfil tbody tr').remove();
$.each(response, function (index,record){
if(valNumber(index)) {
var row = $("<tr class='"+record.IdPerfil+"'/>");
$("<td nombre='"+record.NomPerfil+"'/>").text(record.NomPerfil).appendTo(row);
$("<td />").text(record.DesPerfil).appendTo(row);
$("<td />").html("<img src='media/icons/edit_item.png' class='bModifyProfile' cve='"+record.DesPerfil+"' alt='Editar' title='Editar'></img><img src='media/icons/delete_item.png' class='bDeleteProfile' cve='"+record.IdPerfil+"' alt='Eliminar' title='Eliminar'></img>").appendTo(row);
if (record.EdoPerfil == 1) {
$("<td />").html("<input type='checkbox' checked/>").appendTo(row);
row.css("backgroundColor","#b0f2b1");
} else {
$("<td />").html("<input type='checkbox' />").appendTo(row);
row.css("backgroundColor","#ffddec");
}
$("<td style='display:none;' />").text(record.nomStatus).appendTo(row);
row.appendTo("#rBuscarPerfil tbody");
}
});
}
}
var oTable = $('#rBuscarPerfil').dataTable({
"bJQueryUI": true,
"bRetrieve" : true,
"bDestroy" : true,
"aaSorting": [[ 0, "desc" ]],
"sPaginationType" : "full_numbers"
});
oTable.fnDraw();
我希望您能理解。