Amigos preciso de uma ajuda
Em um sistema, tenho uma TABELA HTML que é populada com dados do BD através de consultas XMLHttpRequest. exemplificando o cenário tenho:
Uma pagina chamada ListarExames.php e outra pagina Busca.php onde no arquivo busca.php está toda a logica com as consultas SQL e o resultado da busca é carregado em uma <div> na pagina ListarExames.php. tudo esta funcionando corretamente, entretanto como algumas vezes como são retornados Muitos resultados na listagem, eu gostaria de fazer com que a tabela que é carregada dinamicamente na <div> virasse um DataTable e não uma tabela simples HTML.
Abaixo segue código da função que dispara a busca
[javascript]
function buscarExames(inicio,pagina){
var numCamposForm=document.filtros.length;
var array_campos = "";
for (i=0;i<numCamposForm;i++){
array_campos=array_campos+document.filtros.id+"="+document.filtros.value.toUpperCase()+"&"; } var valor=array_campos.substring(0,(array_campos.length - 1)); if(valor == '' || valor == ' ') exit; if(window.XMLHttpRequest) { req = new XMLHttpRequest(); } else if(window.ActiveXObject){ req = new ActiveXObject("Microsoft.XMLHTTP"); } var url = "busca.php?"+valor+"&inicio="+inicio+"&pagina="+pagina; req.open("Get", url, true); req.onreadystatechange = function() { if(req.readyState == 1) { document.getElementById('resultado').innerHTML = 'Buscando Exames...'; } if(req.readyState == 4 && req.status == 200) { var resposta = req.responseText; document.getElementById('resultado').innerHTML = resposta; } } req.send(null); }
[/javascript]
na pagina ListarExames.php temos
<div id="resultado"></div>
a tabela é montada no busca.php e possui um id="dcm"
echo'<table id="dcm" class="table display data-results table-condensed table-sm table-hover" cellspacing="0" style="background-color: #ffffff">';
echo'<thead>';
echo'<tr>';
echo'<th>Nº PACIENTE</th>';
echo'<th>NOME DO PACIENTE</th>';
echo'<th>SEXO</th>';
echo'<th>DATA DO EXAME</th>';
echo'<th>TIPO DE EXAME</th>';
echo'<th>MODALIDADE</th>';
echo'<th>AÇÃO</th>';
echo'</tr>';
echo'</thead>';
while($linha = pg_fetch_array($sql))
{
$std_status=$linha['study_status'];
$std_data=$linha['study_date'];
$std_hora=$linha['study_time'];
$pat_name=str_replace('^',' ',$linha['pat_name']);
$pat_sex=$linha['pat_sex'];
$pat_id=$linha['pat_id'];
$std_id=$linha['study_id'];
$std_accession=$linha['accession_no'];
$std_desc=$linha['study_desc'];
$std_mod=$linha['mods_in_study'];
echo'<tbody>';
echo "<td>$pat_id</td>";
echo "<td>$pat_name</td>";
echo "<td>$pat_sex</td>";
echo "<td>$std_data - $std_hora </td>";
echo "<td>$std_desc </td>";
echo "<td>$std_mod</td>";
echo'</tbody>';
Desta forma quando eu chamo a função para transformar a tabela carregada na pagina ListarExames.php em um DataTable
[javascript]
<script type="text/javascript"> $(document).ready(function () { $('#resultado').DataTable(); }); </script>
[/javascript]
Da erro porque o elemento "resultado" é uma <div> e não uma tabela, conforme mensagem:
DataTables warning: Non-table node initialisation (DIV). For more information about this error, please see http://datatables.net/tn/2
e se eu colocar na pagina ListarExames.php o id="dcm" que é o ID da tabela que é gerada dinamicamente na outra pagina busca.php não da certo.
[javascript]
<script type="text/javascript"> $(document).ready(function () { $('#dcm').DataTable(); }); </script>
[/javascript]
Ai o que fiz foi ao inves de um elemento <div> eu coloquei um elemento <table> com o id="resultado" desta forma:
<table id="resultado" class="table display table-condensed data-results table-hover" cellspacing="0" style="background-color: #ffffff">
<thead><tr><th>Nº PACIENTE</th><th>NOME DO PACIENTE</th><th>SEXO</th><th>DATA DO EXAME</th><th>TIPO DE EXAME</th><th>MODALIDADE</th><th>AÇÃO</th></tr></thead>
<tbody><tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr></tbody>
</table>
A principio deu certo carregou todos os dados, apresentou tambem os elementos DataTable como Search a paginação etc.... mais os elementos não funcionam apenas são apresentados, entendi ? por exemplo se digitar alguma coisa no search do datatble não acontece nada, se selecionar apenas 10 resultados por pagina também nao acontece nada, enfim o datatable nao funciona.
É possivel com o jquery selecionar um elemento de outra pagina ? porque pensei que se der para NA PAGINA ListarExames.php que é onde é carregada a tabela selecionar o elemento id="dcm" que é a tabela que é montada na pagina busca.php talves daria certo, vi que tem uma função LOAD do Jquery que faria isso mais não consegui entender e aplicar no meu projeto
Não sei se ficou claro o meu problema, conto com a ajuda de voces pois ja se esgotaram minhas tentativas.
Muito obrigado