Adding datatables to a table (wordpress)

I’m trying to add datatables to my project and it shows up with the arrows and the search bar, but neither work.

I tried testing the code on a page with just the scripts and table and it worked but when I moved it to my wordpress site I run into problems.

Any suggestions? I have the jquery and datatables scripts and css in the header page, as well as the script for the table itself after the /head:

    <script>
       $(document).ready(function(){
       $('#myTable').DataTable();
       });
   </script>

My table itself looks like

     echo "<table id='myTable' class='display table' width='100%'>";
                    echo "<thead>";
                    echo "<tr>";
                    echo "<th>Foster ID</th>";
                    echo "<th>Foster's Name</th>";
                    echo "<th>City</th>";
                    echo "<th>E-Mail</th>";
                    echo "</tr>";
                    echo "</thead>";
                    if(!empty($result)){
                        foreach ($result as $results){
                            $fosterId = $results->memberId;
                            $fosterName = $results->memberName;
                            $city = $results->city;
                            $email = $results->email;
                            echo "<tbody>";
                            echo "<tr>";
                            echo "<td>$fosterId</td>";
                            echo "<td>$fosterName</td>";
                            echo "<td>$city</td>";
                            echo "<td>$email</td>";
                            echo "</tr>";
                        }
                    } else {
                        echo "<tr>";
                        echo "<td colspan='5'>No Fosters</td>";
                        echo "<tr>";
                        echo "</tbody>";
                    }
                    echo "</table>";

Read more here: Adding datatables to a table (wordpress)

Leave a Reply

Your email address will not be published. Required fields are marked *