Ajuda com Datatable

[edupoli 0]

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> 

  

Spoiler

 

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