From 693d237b1d833af4d502273e341d0144c6e90661 Mon Sep 17 00:00:00 2001
From: Nuno <nunochaves@sapo.pt>
Date: Mon, 21 Nov 2016 15:34:29 +0000
Subject: [PATCH] examples added

---
 README.md              | 16 ++++++---
 composer.json          |  4 +--
 src/Examples/test1.php | 73 +++++++++++++++++++++++++++++++++++++++
 src/Examples/test2.php | 78 ++++++++++++++++++++++++++++++++++++++++++
 4 files changed, 165 insertions(+), 6 deletions(-)
 create mode 100644 src/Examples/test1.php
 create mode 100644 src/Examples/test2.php

diff --git a/README.md b/README.md
index 5325a2b..01ec896 100644
--- a/README.md
+++ b/README.md
@@ -33,7 +33,7 @@ Include jupitern/table in your project, by adding it to your composer.json file.
 ## Usage
 ```php
 // instance Table with instance name
-\Jupitern\Table\Table::instance('dt_example')
+\Jupitern\Table\Table::instance()
 
 // set data for non ajax requests
 // using a array
@@ -44,7 +44,7 @@ Include jupitern/table in your project, by adding it to your composer.json file.
 	['id' => 2, 'name' => 'John', 'age' => '44', 'phone' => '169 853 741'],
 ])
 // using json string
-->setData('[[1,"Peter","35","961 168 851"],[2,"John","44","169 853 741"]]')
+->setData([[1,"Peter","35","961 168 851"],[2,"John","44","169 853 741"]])
 // using PDO result or your framework ORM. see example how to grab $data at the end
 ->setData($data)
 
@@ -138,7 +138,7 @@ $data = $db->query("SELECT id, name, age, phone FROM persons")->fetchAll(PDO::FE
 // used for column filter
 $filterData = $db->query("SELECT name as val, name FROM persons limit 10")->fetchAll(PDO::FETCH_OBJ);
 
-\Jupitern\Table\Table::instance('dt_example')
+\Jupitern\Table\Table::instance()
 	->setData($data)
 	->attr('id', 'demoTable')
 	->attr('class', 'table table-bordered table-striped table-hover')
@@ -176,7 +176,7 @@ $filterData = $db->query("SELECT name as val, name FROM persons limit 10")->fetc
 	->render();
 ?>
 
-Jquery and Datatables should be included.
+Include Jquery, Datatables and Bootstrap (optional) in your html.
 
 <!-- JQUERY -->
 <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
@@ -190,6 +190,14 @@ Jquery and Datatables should be included.
 <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();
+	});
+
+</script>
+
 ```
 
 ## Roadmap
diff --git a/composer.json b/composer.json
index 160643b..1bffa4c 100644
--- a/composer.json
+++ b/composer.json
@@ -1,7 +1,7 @@
 {
     "name"       : "jupitern/table",
-    "description": "php table generation. integrates with your favourite orm and js library",
-    "keywords"   : ["table generation", "framework", "ORM", "dataTables", "jQuery", "UI"],
+    "description": "HTML table generation for PHP. integrates with your favourite orm and js library",
+    "keywords"   : ["PHP html table generation", "framework", "ORM", "dataTables", "jQuery", "UI"],
     "homepage"   : "https://github.com/jupitern/table",
     "license"    : "MIT",
     "authors"    : [
diff --git a/src/Examples/test1.php b/src/Examples/test1.php
new file mode 100644
index 0000000..c9f9e90
--- /dev/null
+++ b/src/Examples/test1.php
@@ -0,0 +1,73 @@
+<?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();
+			});
+
+		</script>
+	</head>
+	<body>
+		<div style="width: 50%; margin: 30px;">
+			<?php $table->render(); ?>
+		</div>
+	</body>
+</html>
diff --git a/src/Examples/test2.php b/src/Examples/test2.php
new file mode 100644
index 0000000..444dcd5
--- /dev/null
+++ b/src/Examples/test2.php
@@ -0,0 +1,78 @@
+<?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">
+
+		$(document).ready(function(){
+			$('#demoTable').DataTable();
+		});
+
+	</script>
+</head>
+<body>
+<div style="width: 50%; margin: 30px;">
+	<?php $table->render(); ?>
+</div>
+</body>
+</html>
\ No newline at end of file