<?php require '../../vendor/autoload.php'; $table = \Jupitern\Table\Table::instance()->setData([['id' => 1, 'name' => 'Peter', 'age' => '35', 'phone' => '961 168 851'], ['id' => 2, 'name' => 'John', 'age' => '44', 'phone' => '169 899 742'], ['id' => 3, 'name' => 'Peter', 'age' => '22', 'phone' => '737 853 346'], ['id' => 4, 'name' => 'Clark', 'age' => '34', 'phone' => '169 574 741'], ['id' => 5, 'name' => 'Alex', 'age' => '65', 'phone' => '732 753 467']])->attr('id', 'demoTable')->attr('class', 'table table-bordered table-striped table-hover')->attr('cellspacing', '0')->attr('width', '100%')->column()->title('Name')->value(function ($row) { return rand(1, 10) % 2 ? '<b>' . $row['name'] . '</b>' : $row['name']; })->css('color', 'green')->css('width', '50%')->css('background-color', '#ccc', true)->add()->column()->title('Age')->value('age')->css('color', 'red')->css('width', '20%')->add()->column('Phone')->value('phone')->css('color', 'red')->css('width', '20%')->add()->column()->value(function ($row) { return '<a href="country/' . $row['id'] . '">edit</a>'; })->css('width', '10%')->add(); ?> <html> <head> <!-- JQUERY --> <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <!-- DATATABLES --> <link href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" rel="stylesheet"> <script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script> <!-- Bootstrap and Datatables Bootstrap theme (OPTIONAL) --> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css" rel="stylesheet"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#demoTable').DataTable(); });
<?php require '../../vendor/autoload.php'; // grab data from db with PDO or in alternative from your framework ORM $db = new PDO('mysql:host=HOST_NAME;dbname=DB_NAME;charset=utf8', 'DB_USERNAME', 'DB_PASSWORD', array(PDO::ATTR_EMULATE_PREPARES => false, PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION)); // data to populate table $data = $db->query("SELECT id, name, age, phone FROM persons")->fetchAll(PDO::FETCH_OBJ); // used for column filter $filterData = $db->query("SELECT name as val, name FROM persons limit 10")->fetchAll(PDO::FETCH_OBJ); \Jupitern\Table\Table::instance()->setData($data)->attr('id', 'demoTable')->attr('class', 'table table-bordered table-striped table-hover')->attr('cellspacing', '0')->attr('width', '100%')->column()->title('Name')->value(function ($row) { return rand(1, 10) % 2 ? '<b>' . $row['name'] . '</b>' : $row['name']; })->filter($filterData)->css('color', 'green')->css('width', '50%')->css('background-color', '#ccc', true)->add()->column()->title('Age')->value('age')->filter()->css('color', 'red')->css('width', '20%')->add()->column('Phone')->filter()->value('phone')->css('color', 'red')->css('width', '20%')->add()->column()->value(function ($row) { return '<a href="country/' . $row['id'] . '">edit</a>'; })->css('width', '10%')->add(); ?> <html> <head> <!-- JQUERY --> <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <!-- DATATABLES --> <link href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" rel="stylesheet"> <script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script> <!-- Bootstrap and Datatables Bootstrap theme (OPTIONAL) --> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <link href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css" rel="stylesheet"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script type="text/javascript">