Download And Use FooTable

How To Download And Use FooTable

________________________________________________________

In this FooTable Tutorial we will see How To Download And Use Foo Table To Style Html Table .

I Use In This Tutorial:
-FooTable.
-Php.
- NetBeans IDE .
- XAMPP .
- PhpMyAdmin .

First Download Footable


 

Source Code:

<!-- php code to get data from mysql database -->

<?php

$hostname = "localhost";

$username = "root";

$password = "";

$databaseName = "test_db";

$connect = mysqli_connect($hostname, $username, $password, $databaseName);

$query = "SELECT * FROM `users";

$result = mysqli_query($connect, $query);

?>

<!DOCTYPE html>

<html>

    <head>

        <title> Using FooTable </title>

        <meta charset="UTF-8">

        <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <link rel="stylesheet" href="css/footable.core.css">

        <link rel="stylesheet" href="css/footable.metro.css">

  </head>

  

    <body>

     

        <table class="footable">

            <thead>

            <tr>

                <th>Id</th>

                <th>First Name</th>

                <th>Last Name</th>

                <th>Age</th>

            </tr>

            </thead>

            <tbody>

                <!-- populate table from mysql database -->

            <?php while($row1 = mysqli_fetch_array($result)):;?>

            <tr>

                <td><?php echo $row1[0];?></td>

                <td><?php echo $row1[1];?></td>

                <td><?php echo $row1[2];?></td>

                <td><?php echo $row1[3];?></td>

            </tr>

            <?php endwhile;?>

            </tbody>

        </table>

    </body>

</html>

///////////////OUTPUT: 

                                                           
                                                                 

footable using metro style

footable using standalone style

                     

Demos From fooplugins :
Metro Theme
Standalone Theme

Other FooTable Tutorials :
Sorting Html Table
Responsive Html Table
Create a Pagination In Html Table
Search And Filter Data In Html Table

---

More PHP

➜ PHP Projects

➜ PHP Courses

➜ More Resources