eine Zeile in PHP holen und Datentabelle

Question

Iam mit Datatable Dies gilt mein Code:

var table = $('#open').DataTable({ }); 

Das ist mein HTML-Tabelle Code:

  <table id="open"> 
       <thead> 
      <tr> 
       <th rowspan="2"> S.No </th> 
       <th rowspan="2"> Patient Name </th> 
       <th colspan="2"> Booking </th> 
       <th rowspan="2"> Insurance Company</th> 
       <th rowspan="2">Appointment Status</th> 
       <th rowspan="2">Edit</th> 
      </tr> 

      <tr> 

      <th> Date </th> 
      <th> Time </th> 
      </tr> 
       </thead> 
       <tbody id="booking"> 
       </tbody> 
      </table> 

Das ist mein Ajax-Code:

var date = $("#date").val(); 
$.ajax({ 
      type: 'POST', 
      url: 'booked1.php', 
      data: { 
       date: date 
      }, 
      cache: false, 
      dataType: "html", 
      success: function (response) { 
       alert(response); 

       $("#booking").html(response); 
       $("#loadarModal").modal('hide'); 

      } 


     }); 

Dies ist mein booked1.php Code:

if (isset($_POST['date'])) { 
$date = $_POST['date']; 
$query = mysqli_query($conn, "select id as id, concat(fname,' ',lname) as name, date as date, bookingtoken as bookingtoken, inusrance as insurance, 
appointment_status as appointment_status from at_booking where date='$date' 
"); 


    while ($rows = mysqli_fetch_assoc($query)) { 
     $name = $rows['name']; 
     $id = $rows['id']; 
     $date = $rows['date']; 
     $bookingtoken = $rows['bookingtoken']; 
     $insurance = $rows['insurance']; 
     $appointment = $rows['appointment_status']; 

     echo '<tr>'; 
     echo "<td>$id</td>"; 
     echo "<td>$name</td>"; 
     echo "<td>$date</td>"; 
     echo "<td>$bookingtoken</td>"; 
     echo "<td>$insurance</td>"; 
     echo "<td>$appointment</td>"; 
     echo '</tr>'; 
    } 
} 

Ich bin erfolgreich holen Zeilen durch PHP und Anhängen Antwort an tbody aber Datentabelle funktioniert nicht richtig wie Suche funktioniert nicht und keine der Einträge funktioniert nicht Seitennummerierung wird nicht angezeigt ich weiß nicht, wie man das lösen kann mir jemand helfen

Answer 1

Wenn Sie DataTables doc verweisen. Dann werden Sie feststellen, dass die Daten vom Remote-Server im JSON-Format sein müssen. Während Sie keine Daten in JSON senden. Das ist das Problem. Sie müssen Ihren Code wie unten

$result = array(); 
while ($rows = mysqli_fetch_assoc($query)) { 
     $name = $rows['name']; 
     $id = $rows['id']; 
     $date = $rows['date']; 
     $bookingtoken = $rows['bookingtoken']; 
     $insurance = $rows['insurance']; 
     $appointment = $rows['appointment_status']; 

     $result[] = array($name,$id,$date,$bookingtoken,$insurance,appointment); 
    } 
} 
echo json_encode(array("data"=>$result)); 

EDIT

Datentabelle selbst geben Sie Einrichtung für Ajax ändern. Es ist nicht nötig, explizit Ajax hinzuzufügen. Entfernen Sie Ihre Ajax-Code und ändern Sie Ihre Datentabelle Initialisierung unter

$('#open').DataTable({ 
    "ajax": 'booked1.php' 
}); 

Auch Sie gleiche Anzahl von th haben muss und td (Anzahl der Spalten müssen gleich sein)

Answer 2

\t $(document).ready(function() { 
 
    \t $('#booked').DataTable(); 
 
\t });

<link href="https://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script> 
 
<table id="booked"> 
 
<thead> 
 
    <tr> 
 
    <th>Name</th> 
 
    <th>SurName</th> 
 
    </tr> 
 
</thead> 
 
<tfoot> 
 
    <tr> 
 
    <th>Name</th> 
 
    <th>SurName</th> 
 
    </tr> 
 
</tfoot> 
 
<tbody> 
 

 
<!-- Your Foreach loop starts here --> 
 

 
    <tr> 
 
    <td>Hello</td> 
 
    <td>How</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Abc</td> 
 
    <td>XYZ</td> 
 
    </tr> 
 
<!-- Your Foreach loop endshere --> 
 
</tbody> 
 
</table>

Answer 3

Sie kann dies versuchen --- Tabelle mit json Antwort anhängen:

<?php 
if (isset($_POST['date'])) { 
$date = $_POST['date']; 
$query = mysqli_query($conn, "select id as id, concat(fname,' ',lname) as name, date as date, bookingtoken as bookingtoken, inusrance as insurance, 
appointment_status as appointment_status from at_booking where date='$date' 
"); 

$data = []; 
$i=0; 
while ($rows = mysqli_fetch_array($query)) { 
$data[$i]['name'] = $rows['name']; 
$data[$i]['id'] = $rows['id']; 
$i++; 
} 
echo json_encode($data); 
} 
?> 

<script> 
var date = $("#date").val(); 
$("#open tbody > tr").remove(); 
$.ajax({ 
type: 'POST', 
url: 'booked1.php', 
dataType : "json", 
data: { 
date: date 
}, 
cache: false, 
dataType: "html", 
success: function (response) { 
$("#loadarModal").modal('hide'); 
table = ''; 
$.each(response,function(indx,obj){ 
table += '<tr>'; 
table += '<td>'+ obj.id +'</td>'; 
table += '<td>'+ obj.name +'</td>'; 
table += '</tr>'; 
}); 
$("tbody#booking").append(table); 
} 
}); 
</script> 

Answer 4

var table = null; 
 
$(document).ready(function() { 
 
    table = $('#example').DataTable(); 
 
    AddRowsAfterFewSeconds(); 
 
}); 
 

 
function AddRowsAfterFewSeconds() { 
 
    setTimeout(function() { 
 
    var strTR = '<tr>' + 
 
     '<td>YYYYY Kelly</td>' + 
 
     '<td>Senior Javascript Developer</td>' + 
 
     '<td>TTTTTT</td>' + 
 
     '<td>22</td>' + 
 
     '<td>2012/03/29</td>' + 
 
     '<td>$433,060</td>' + 
 
     '</tr>' + 
 
     '<tr>' + 
 
     '<td>SSSSS Kelly</td>' + 
 
     '<td>Senior Javascript Developer</td>' + 
 
     '<td>BBBBB</td>' + 
 
     '<td>15</td>' + 
 
     '<td>2012/03/29</td>' + 
 
     '<td>$433,060</td>' + 
 
     '</tr>'; 
 
    table.rows().remove(); 
 
    $(strTR).each(function() { 
 
     table.row.add($(this)); 
 
    }); 
 
    table.draw(); 
 
    }, 3000); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script> 
 
<link href="https://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css" rel="stylesheet" /> 
 
<table id="example" class="display" cellspacing="0" width="100%"> 
 
    <thead> 
 
    <tr> 
 
     <th>Name</th> 
 
     <th>Position</th> 
 
     <th>Office</th> 
 
     <th>Age</th> 
 
     <th>Start date</th> 
 
     <th>Salary</th> 
 
    </tr> 
 
    </thead> 
 
    <tfoot> 
 
    <tr> 
 
     <th>Name</th> 
 
     <th>Position</th> 
 
     <th>Office</th> 
 
     <th>Age</th> 
 
     <th>Start date</th> 
 
     <th>Salary</th> 
 
    </tr> 
 
    </tfoot> 
 
    <tbody> 
 
    <tr> 
 
     <td>Tiger Nixon</td> 
 
     <td>System Architect</td> 
 
     <td>Edinburgh</td> 
 
     <td>61</td> 
 
     <td>2011/04/25</td> 
 
     <td>$320,800</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Cedric Kelly</td> 
 
     <td>Senior Javascript Developer</td> 
 
     <td>Roomus</td> 
 
     <td>22</td> 
 
     <td>2012/03/29</td> 
 
     <td>$433,060</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Airi Satou</td> 
 
     <td>Accountant</td> 
 
     <td>Tokyo</td> 
 
     <td>33</td> 
 
     <td>2008/11/28</td> 
 
     <td>$162,700</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Dieses Verfahren fügt dynamisch Zeilen in die Datentabelle. (Hier habe ich einfach die setTimeOut-Funktion anstelle der AJAX-Antwort verwendet). Es wird dynamisch Zeilen nach ‚3 Sekunden‘ add

$(strTR).each(function() { 
    table.row.add($(this)).draw(); 
}); 

einfach eine Schleife durch alle Zeilen nach der Ebene von HTML-Text zur Umwandlung von ‚tr‘ Elementen, und dann zu der Tabelle hinzu und zeichnet schließlich die Tabelle nach dem alle Zeilen hinzufügen

Ich habe die Option gesehen, Arrays direkt zu DataTable hinzuzufügen. Aber es funktioniert nicht in meinem Code. Also habe ich sie in einer Schleife hinzugefügt.