how to set Datatable plugin for my php table

Question

i'm new in jquery and i have a probleme when trinig to show searche field and organisation butom of the pluginwiche to integrate datatable in my source code, and i'm not sure of integration of js and css file link.

here is my source code of table

     <div class="table responsive ">
      <table id="datatable" class="table table-condensed table-striped table-hover no-margin display" cellspacing="0" width="100%"> 
        <thead>
        <tr class="table-danger">
            <th>Nom</th>
            <th>Prenom</th>
            <th>Structure</th>
            <th>Email</th>
            <th>Date rec</th>
            <th>RC</th>
            <th>Matricule</th>
            <th></th>
            <th></th>
        </tr>
        </thead>

    <?php 

    if (strcmp($affectation,'DSI')==0)  
        {

            while($query2=mysqli_fetch_array($query1))
            {
            echo "<tbody><tr><td>".$query2['name']."</td>";
            echo "<td>".$query2['prenom']."</td>";
            echo "<td>".$query2['affectation']."</td>";
            echo "<td class=\"col-xs\">".$query2['email']."</td>";
            echo "<td>".$query2['date_rec']."</td>";
            echo "<td class=\"text-DANGER\">".$query2['nbr_rc']." Jours</td>";
            echo "<td>".$query2['matricule']."</td>";
            echo "<td> <a class=\"btn btn-primary btn-xs green pull-center\" href='aff_emp.php?sessId=$sessId&id=".$query2['id']."'>Afficher </a></td>";
            }

        }

    else
            {

            while($query4=mysqli_fetch_array($query3))
            {
            echo "<tbody><tr><td>".$query4['name']."</td>";
            echo "<td>".$query4['prenom']."</td>";
            echo "<td>".$query4['affectation']."</td>";
            echo "<td>".$query4['email']."</td>";
            echo "<td>".$query4['date_rec']."</td>";
            echo "<td class=\"text-DANGER\">".$query4['nbr_rc']." Jours</td>";
            echo "<td>".$query4['matricule']."</td>";
            echo "<td> <a class=\"btn btn-primary btn-xs green pull-center\" href='edit.php?sessId=$sessId&id=".$query4['id']."'>Modifier</a></td>";
            echo "<td> <button type=\"button\" class=\"btn btn-xs green btn-primary disabled pull-center\">Supp</button> ";
            echo "<td> <a class=\"btn btn-primary btn-xs green pull-center\" href='aff_emp.php?sessId=$sessId&id=".$query4['id']."'>Afficher </a></td>";
            }

    }

    ?>
            </td>
        </tr>
    </tbody>
  </table>

tks in advance and source javascript of function datatable

<head>
    <meta charset="UTF-8">
    <title>Application gestion de RC</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/jquery.dataTables.min.css">
    <link rel="stylesheet" href="css/jquery.dataTables.css">

    <script type="text/javascript" src="js/jquery-1.8.2.js"></script>
    <script type="text/javascript" src="js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="js/jquery.dataTables.js"></script>

    <script src="js/jquery.min.js"></script>

    <script type="text/javascript" language="javascript" >

    $(document).ready(function()
    {
        $('#datatable').dataTable();
    });

    </script>

</head>

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

Case Sensitive

Has nothing to do with php...

$(document).ready(function() {
    $('#datatable').dataTable();
});

should be

$(document).ready(function() {
    $('#datatable').DataTable();
});

Note the upper case DataTable();

use your developer tools or firebug to see the javascript console so you can see errors like this.

Examle

check out this Example on codepen.io

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered May 19, 2016 at 17:59

tempcke

7309 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Ohgodwhy Over a year ago

+1. Don't forget that it requires a well formed <tbody></tbody> tag. OP did not close their </tbody> and should also not put the opening <tbody> tag within their loop.

MoniXx Over a year ago

I think he is asking if he could place the search field at the bottom of the table.

tempcke Over a year ago

the OP text is unclear he said 'butom' which I thought was 'button'. He also questioned 'integration of js and css file link' which I thought implied he was not able to get datatables to work at all

Bogdan Bocioaca · Accepted Answer · 2016-05-19 18:01:29Z

0

move the outside the while loop .. and move the inside the while loop

so

tbody
while{
<tr>
<td><td>
...
</tr>
}
<tbody>

answered May 19, 2016 at 18:01

Bogdan Bocioaca

362 bronze badges

Comments

MoniXx · Accepted Answer · 2016-05-19 18:02:51Z

0

Datatables lets you position its elements like the sarchbox, its relatively easy, you can take a look here. https://www.datatables.net/examples/basic_init/dom.html

answered May 19, 2016 at 18:02

MoniXx

1355 bronze badges

Collectives™ on Stack Overflow

how to set Datatable plugin for my php table

3 Answers 3

Case Sensitive

Examle

3 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Case Sensitive

Examle

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related