Nur eine HTML-Tabelle aktualisieren, nicht die gesamte Seite

Question

guten Nachmittag! Ich habe eine HTML-Tabelle in Kombination mit PHP. Ich möchte Folgendes tun: Wenn Sie neue Daten in die Datenbank eingeben, wird die Tabelle aktualisiert, um die neuen Daten anzuzeigen, jedoch nur die Tabelle und nicht den Rest der Seite. Ehrlich gesagt bin ich kein Programmierer, aber ich habe verstanden, dass es mit JSON und Ajax gemacht werden kann, aber ich weiß nicht wie. Wenn jemand Zeit und Geduld hat, mir zu sagen, wie sehr ich es schätze.

Das ist mein Php-Code:

<?php 
// ----------- CONEXIÓN ------------------ 
    require 'RecibeConsultaPuenteConexion.php'; 
    //echo "Conexión OKAS <br />"; 
    // ----------- TRAYENDO DATOS ------------------  
    $statement = $conexion->query('SELECT * FROM tbl_consultas'); 
    $statement->execute(); 


$resultados = $statement->fetchAll(); 
foreach ($resultados as $fila) { 



} 





// json_encode($fila); 


?> 

Und das ist mein HTML-Code:

<form action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']); ?>" > 
    <table class="Pizarra" id="pizarra" name="pizarra" cellspacing="0px";> 
     <tr class="trThDos"> 
     <th></th> 
     <th></th> 
     <th></th> 
     <th></th> 
     <th></th> 
     </tr> 
     <tbody> 
     <!-- Comienza PHP --> 
     <?php 
     $i = 0; 
     foreach ($resultados as $fila) { 
     ?> 
      <tr class="trPizarra" id="trPizarra"> 

      <td class="tdTurno" style="text-align:center;"><?php echo '#' . ++$i ?></td> 

      <td class="tdImg" style="text-align:center;"><?php echo $fila ['asunto']; 

        switch ($fila['asunto']){ 

        case "0": 
        echo "<img src='./img/consulta-56-2.png' title=\"Consulta.\" height=\"32\" width=\"32\">"; 
        break; 

        case "1": 
        echo "<img src='./img/shot-56-2.png' title=\"Inyección.\" height=\"32\" width=\"32\">"; 
        break; 

        case "2": 
        echo "<img src='./img/ta-56-2.png' title=\"Toma de presión.\" height=\"32\" width=\"32\">"; 
        break; 

        case "3": 
        echo "<img src='./img/cert-56-2.png' title=\"Certificado médico.\" height=\"32\" width=\"32\">"; 
        break; 

        case "4": 
        echo "<img src='./img/consulta-56-4.png' title=\"Consulta ⬇ abajo.\" height=\"32\" width=\"32\">"; 
        break; 

        case "5": 
        echo "<img src='./img/shot-56-4.png' title=\"Inyección ⬇ abajo.\" height=\"32\" width=\"32\">"; 
        break; 

        case "6": 
        echo "<img src='./img/ta-56-4.png' title=\"Toma de presión ⬇ abajo.\" height=\"32\" width=\"32\">"; 
        break; 

        case "7": 
        echo "<img src='./img/cert-56-4.png' title=\"Certificado médico ⬇ abajo.\" height=\"32\" width=\"32\">"; 
        break; 

        default: 
        echo "Hubo un error en la selección de asunto"; 
        break; 

        } ?></td> 

      <td class="tdNombre" id="tdNombre" style="text-align:center;"><?php echo $fila ['nombre_completo']; ?></td> 

      <td class="tdHr" style="text-align:center;"><?php echo $fila ['hora']; ?> <span class="icon icon-stopwatch"></span></td> 

      <td class="td-aceptar"> 
      <a class="aceptar-a" id="aceptar-a" href="http://localhost/FARMAXIA/index.php?id=<?php echo $fila['ID']; ?>" title="Aceptar paciente." > 
      <button class="btn btn-xs" id="aceptar-btn" ><span class="glyphicon glyphicon-ok"></span> Aceptar</button> 
      </a> 
      </td> 

      </tr> 
     <?php } ?> 
     <!-- Terminó PHP --> 
      <tfoot class="tableFoot"> 
       <tr> 
        <td colspan="5"><p>&nbsp;</p></td> 
       </tr> 
      </tfoot> 

     </tbody> 
    </table> 
    </form> 

Answer 1

Ihre Grundbloß Knochen würde Code dieses

Ihre jQuery-Code

sein

//asuming you want to refresh your table every 5 sec 
function refresh_table() 
{ 
    $.ajax({ 
     type:"POST", 
     url:"my_refresh_php_code.php", 
     cache:false, 
     success:function(html){ // html returns the code outputted from the below php script 
      $("my_table_class_or_id").html(html); //replace your table html with the new one 
     } 
    }) 
} 

setInterval(refresh_table, 5000); 

Ihr "mein_ refresh_php_code.php“Skript

<?php 

//output the data you want your table to be refreshed with 
echo "my text" 

?>