Skip to content

Commit 5d4a78a

Browse files
author
Dipu Raj
committed
Added more examples
1 parent c35d574 commit 5d4a78a

File tree

8 files changed

+211
-62
lines changed

8 files changed

+211
-62
lines changed

‎README.md‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,12 @@ SmartGrid focus on data display than data manipulation.
44
We are starting with limited features to make the code very simple and robust,
55
yet we will be adding more feature on the go. The code is very simple and well documented, which make it easy for customization.
66

7+
Demos
8+
-----
9+
+ [Basic](http://techlaboratory.net/smartgrid/demo/example-smartgrid)
10+
+ [Array Datasource](http://techlaboratory.net/smartgrid/demo/example-array-grid)
11+
+ [with DataTables](http://techlaboratory.net/smartgrid/demo/example-smartgrid_and-datatables)
12+
713
Installation
814
-----
915
1. [Download](https://github.com/techlab/codeigniter-smartgrid/archive/master.zip) the source files
@@ -27,7 +33,7 @@ $columns = array("employee_id"=>array("header"=>"Employee ID", "type"=>"label"),
2733
);
2834

2935
// Set the grid
30-
$this->smartgrid->set_grid($sql, $columns, $config);
36+
$this->smartgrid->set_grid($sql, $columns);
3137

3238
// Render the grid and assign to data array, so it can be print to on the view
3339
$data['grid_html'] = $this->smartgrid->render_grid();

‎application/controllers/Example_smartgrid.php‎

Lines changed: 20 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -13,60 +13,39 @@ public function index()
1313
// SQl for grid
1414
$where = '';
1515
$where .= !empty($employee_name) ? " AND employee_name LIKE '%$employee_name%' " : "";
16-
$sql = "SELECT *, '<div>HIHIHI</div>' as htmlEx, 'http://php.net/images/logo.php' as imgEx FROM employee WHERE 1=1 $where ";
16+
$sql = "SELECT *
17+
FROM employee
18+
WHERE 1=1 $where ";
19+
20+
// Source array for enum field
21+
$gender_list = array(
22+
"0"=>"Others",
23+
"1"=>"Male",
24+
"2"=>"Female"
25+
);
1726

1827
// Column settings
1928
$columns = array(
20-
"employee_id"=>array("header"=>"Employee ID", "type"=>"label", "align"=>"left", "width"=>"80px"),
29+
"employee_id"=>array("header"=>"Employee ID", "type"=>"label", "align"=>"left", "width"=>"100px"),
2130
"employee_name"=>array("header"=>"Employee Name", "type"=>"label", "align"=>"left", "width"=>"150px"),
22-
"employee_dob"=>array("header"=>"Date of Birth", "type"=>"date", "align"=>"center", "width"=>"230px", "date_format"=>"l jS \of F Y h:i:s A", "date_format_from"=>"Y-m-d H:i:s"),
31+
"employee_dob"=>array("header"=>"Date of Birth", "type"=>"date", "align"=>"center", "width"=>"150px", "date_format"=>"Y-m-d", "date_format_from"=>"Y-m-d H:i:s"),
2332
"employee_join_date"=>array("header"=>"Join Date", "type"=>"relativedate", "align"=>"left", "width"=>"150px"),
24-
"employee_gender"=>array("header"=>"Gender", "type"=>"label", "align"=>"center", "width"=>"50px"),
25-
"htmlEx"=>array("header"=>"HTML", "type"=>"html", "align"=>"center", "width"=>"50px"),
26-
"imgEx"=>array("header"=>"Image", "type"=>"image", "align"=>"center", "width"=>"50px", "image_width"=>"50px")
33+
"employee_gender"=>array("header"=>"Gender", "type"=>"enum", "source"=>$gender_list, "align"=>"center", "width"=>"100px"),
34+
"employee_salary"=>array("header"=>"Salary", "type"=>"money", "sign"=>"$", "align"=>"right", "width"=>"100px"),
35+
"performance_index"=>array("header"=>"Performance", "type"=>"progressbar", "align"=>"center", "width"=>"100px"),
36+
// "employee_img_url"=>array("header"=>"Image", "type"=>"image", "align"=>"center", "width"=>"50px", "image_width"=>"50px"),
2737
);
38+
2839
// Config settings, optional
2940
$config = array("page_size"=> 5,
3041
"grid_name"=> "sg_1",
31-
"paging_enabled"=> true,
32-
"toolbar_position"=> 'top',
33-
"auto_generate_columns"=> true);
42+
"toolbar_position"=> 'both');
43+
3444
// Set the grid
3545
$this->smartgrid->set_grid($sql, $columns, $config);
36-
// Render the grid and assign to data array, so it can be print to on the view
37-
$data['grid_html1'] = $this->smartgrid->render_grid();
38-
39-
// Data as array
40-
$data_list = array(
41-
array("employee_id"=> "1" ,"employee_name"=> "Dipu Raj1", "employee_join_date"=> "2017-03-18 15:09:02" ,"employee_gender"=> "Male", "employee_dob"=> "1981-03-17" ),
42-
array("employee_id"=> "2" ,"employee_name"=> "Dipu Raj2", "employee_join_date"=> "2017-03-18 15:09:02" ,"employee_gender"=> "Male", "employee_dob"=> "1981-03-17" ),
43-
array("employee_id"=> "3" ,"employee_name"=> "Dipu Raj3", "employee_join_date"=> "2017-03-18 15:09:02" ,"employee_gender"=> "Male", "employee_dob"=> "1981-03-17" ),
44-
array("employee_id"=> "4" ,"employee_name"=> "Dipu Raj4", "employee_join_date"=> "2017-03-18 15:09:02" ,"employee_gender"=> "Male", "employee_dob"=> "1981-03-17" ),
45-
array("employee_id"=> "5" ,"employee_name"=> "Dipu Raj5", "employee_join_date"=> "2017-03-18 15:09:02" ,"employee_gender"=> "Male", "employee_dob"=> "1981-03-17" ),
46-
array("employee_id"=> "6" ,"employee_name"=> "Dipu Raj6", "employee_join_date"=> "2017-03-18 15:09:02" ,"employee_gender"=> "Male", "employee_dob"=> "1981-03-17" ),
47-
array("employee_id"=> "7" ,"employee_name"=> "Dipu Raj7", "employee_join_date"=> "2017-03-18 15:09:02" ,"employee_gender"=> "Male", "employee_dob"=> "1981-03-17" ),
48-
array("employee_id"=> "8" ,"employee_name"=> "Dipu Raj8", "employee_join_date"=> "2017-03-18 15:09:02" ,"employee_gender"=> "Male", "employee_dob"=> "1981-03-17" ),
49-
array("employee_id"=> "9" ,"employee_name"=> "Dipu Raj9", "employee_join_date"=> "2017-03-18 15:09:02" ,"employee_gender"=> "Male", "employee_dob"=> "1981-03-17" ),
50-
);
5146

52-
// Column settings
53-
$columns = array(
54-
"employee_id"=>array("header"=>"Employee ID", "type"=>"label", "align"=>"left", "width"=>"80px"),
55-
"employee_name"=>array("header"=>"Employee Name", "type"=>"label", "align"=>"left", "width"=>"150px"),
56-
"employee_dob"=>array("header"=>"Date of Birth", "type"=>"date", "align"=>"center", "width"=>"230px", "date_format"=>"l jS \of F Y h:i:s A", "date_format_from"=>"Y-m-d H:i:s"),
57-
"employee_join_date"=>array("header"=>"Join Date", "type"=>"relativedate", "align"=>"left", "width"=>"150px"),
58-
"employee_gender"=>array("header"=>"Gender", "type"=>"label", "align"=>"center", "width"=>"50px"),
59-
);
60-
// Config settings, optional
61-
$config = array("page_size"=> 5,
62-
"grid_name"=> "sg_2",
63-
"paging_enabled"=> true,
64-
"toolbar_position"=> 'both',
65-
"auto_generate_columns"=> true);
66-
// Set the grid
67-
$this->smartgrid->set_grid($data_list, $columns, $config);
6847
// Render the grid and assign to data array, so it can be print to on the view
69-
$data['grid_html2'] = $this->smartgrid->render_grid();
48+
$data['grid_html'] = $this->smartgrid->render_grid();
7049

7150
// Load view
7251
$this->load->view('example_smartgrid', $data);

‎application/controllers/Example_smartgrid_and_datatables.php‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
<?php
2+
defined('BASEPATH') OR exit('No direct script access allowed');
3+
4+
class Example_smartgrid_and_datatables extends CI_Controller {
5+
6+
public function index()
7+
{
8+
// Load the SmartGrid Library
9+
$this->load->library('SmartGrid/Smartgrid');
10+
11+
// SQl for grid
12+
$sql = "SELECT * FROM employee ";
13+
14+
// Column settings
15+
$columns = array(
16+
"employee_id"=>array("header"=>"Employee ID", "type"=>"label", "align"=>"left", "width"=>"80px"),
17+
"employee_name"=>array("header"=>"Employee Name", "type"=>"label", "align"=>"left", "width"=>"150px"),
18+
"employee_dob"=>array("header"=>"Date of Birth", "type"=>"date", "align"=>"center", "width"=>"230px", "date_format"=>"l jS \of F Y h:i:s A", "date_format_from"=>"Y-m-d H:i:s"),
19+
"employee_join_date"=>array("header"=>"Join Date", "type"=>"relativedate", "align"=>"left", "width"=>"150px"),
20+
"employee_gender"=>array("header"=>"Gender", "type"=>"label", "align"=>"center", "width"=>"50px")
21+
);
22+
23+
// Config settings
24+
// Setting 'paging_enabled' to false will not add paging controls or limits the rows
25+
// it will just display the data as it on the datasource
26+
$config = array("paging_enabled"=> false);
27+
28+
// Set the grid
29+
$this->smartgrid->set_grid($sql, $columns, $config);
30+
31+
// Render the grid and assign to data array, so it can be print to on the view
32+
$data['grid_html'] = $this->smartgrid->render_grid();
33+
34+
// Load view
35+
$this->load->view('smartgrid_and_datatables', $data);
36+
}
37+
}

‎application/controllers/Example_smartgrid_arraygrid.php‎

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
<?php
2+
defined('BASEPATH') OR exit('No direct script access allowed');
3+
4+
class Example_smartgrid_arraygrid extends CI_Controller {
5+
6+
public function index()
7+
{
8+
$employee_name = trim($this->input->get_post('employee_name', TRUE));
9+
10+
// Load the SmartGrid Library
11+
$this->load->library('SmartGrid/Smartgrid');
12+
13+
// Data as array
14+
$data_list = array(
15+
array("order_id"=> "10002001" ,"user_name"=> "Jill Johnson", "order_date"=> "2016-01-08 05:19:12" ,"order_status_id"=> "2", "order_shipping_status"=> "100", "order_note"=> "User confirmed" ),
16+
array("order_id"=> "10002002" ,"user_name"=> "Kelly Smith", "order_date"=> "2016-03-16 15:19:11" ,"order_status_id"=> "2", "order_shipping_status"=> "100", "order_note"=> "User confirmed" ),
17+
array("order_id"=> "10002003" ,"user_name"=> "Jane Austin", "order_date"=> "2016-04-18 12:19:12" ,"order_status_id"=> "3", "order_shipping_status"=> "0", "order_note"=> "User confirmed" ),
18+
array("order_id"=> "10002004" ,"user_name"=> "Sam Kimmel", "order_date"=> "2016-05-11 02:19:14" ,"order_status_id"=> "4", "order_shipping_status"=> "", "order_note"=> "User confirmed" ),
19+
array("order_id"=> "10002005" ,"user_name"=> "Robert Alfy", "order_date"=> "2016-06-08 03:29:32" ,"order_status_id"=> "3", "order_shipping_status"=> "60", "order_note"=> "User confirmed" ),
20+
array("order_id"=> "10002006" ,"user_name"=> "Park Mark", "order_date"=> "2016-06-12 05:19:12" ,"order_status_id"=> "5", "order_shipping_status"=> "", "order_note"=> "User confirmed" ),
21+
array("order_id"=> "10002007" ,"user_name"=> "Paul John", "order_date"=> "2016-06-23 05:19:12" ,"order_status_id"=> "3", "order_shipping_status"=> "20", "order_note"=> "User confirmed" ),
22+
array("order_id"=> "10002008" ,"user_name"=> "Jessica Bill", "order_date"=> "2016-07-08 05:19:12" ,"order_status_id"=> "4", "order_shipping_status"=> "", "order_note"=> "User confirmed" ),
23+
array("order_id"=> "10002009" ,"user_name"=> "Jackson Grey", "order_date"=> "2016-07-18 05:19:12" ,"order_status_id"=> "1", "order_shipping_status"=> "", "order_note"=> "User confirmed" ),
24+
array("order_id"=> "10002010" ,"user_name"=> "Jill Johnson", "order_date"=> "2016-01-08 05:19:12" ,"order_status_id"=> "2", "order_shipping_status"=> "100", "order_note"=> "User confirmed" ),
25+
array("order_id"=> "10002011" ,"user_name"=> "Jill Johnson", "order_date"=> "2016-01-08 05:19:12" ,"order_status_id"=> "2", "order_shipping_status"=> "100", "order_note"=> "User confirmed" ),
26+
array("order_id"=> "10002012" ,"user_name"=> "Kelly Smith", "order_date"=> "2016-03-16 15:19:11" ,"order_status_id"=> "2", "order_shipping_status"=> "100", "order_note"=> "User confirmed" ),
27+
array("order_id"=> "10002013" ,"user_name"=> "Jane Austin", "order_date"=> "2016-04-18 12:19:12" ,"order_status_id"=> "3", "order_shipping_status"=> "0", "order_note"=> "User confirmed" ),
28+
array("order_id"=> "10002014" ,"user_name"=> "Sam Kimmel", "order_date"=> "2016-05-11 02:19:14" ,"order_status_id"=> "4", "order_shipping_status"=> "", "order_note"=> "User confirmed" ),
29+
array("order_id"=> "10002015" ,"user_name"=> "Robert Alfy", "order_date"=> "2016-06-08 03:29:32" ,"order_status_id"=> "3", "order_shipping_status"=> "60", "order_note"=> "User confirmed" ),
30+
array("order_id"=> "10002016" ,"user_name"=> "Park Mark", "order_date"=> "2016-06-12 05:19:12" ,"order_status_id"=> "5", "order_shipping_status"=> "", "order_note"=> "User confirmed" ),
31+
array("order_id"=> "10002017" ,"user_name"=> "Paul John", "order_date"=> "2016-06-23 05:19:12" ,"order_status_id"=> "3", "order_shipping_status"=> "20", "order_note"=> "User confirmed" ),
32+
array("order_id"=> "10002018" ,"user_name"=> "Jessica Bill", "order_date"=> "2016-07-08 05:19:12" ,"order_status_id"=> "4", "order_shipping_status"=> "", "order_note"=> "User confirmed" ),
33+
array("order_id"=> "10002019" ,"user_name"=> "Jackson Grey", "order_date"=> "2016-07-18 05:19:12" ,"order_status_id"=> "1", "order_shipping_status"=> "", "order_note"=> "User confirmed" ),
34+
);
35+
36+
// Source array for enum field
37+
$order_status_list = array(
38+
"1"=>"Pending",
39+
"2"=>"Confirmed",
40+
"3"=>"Shipped",
41+
"4"=>"Expired",
42+
"5"=>"Cancelled"
43+
);
44+
45+
// Column settings
46+
$columns = array(
47+
"order_id"=>array("header"=>"Order ID", "type"=>"label", "align"=>"left", "width"=>"100px"),
48+
"user_name"=>array("header"=>"User Name", "type"=>"label", "align"=>"left", "width"=>"200px"),
49+
"order_date"=>array("header"=>"Order Date", "type"=>"date", "align"=>"center", "width"=>"150px", "date_format"=>"Y-m-d", "date_format_from"=>"Y-m-d H:i:s"),
50+
"order_status_id"=>array("header"=>"Order Status", "type"=>"enum", "source"=>$order_status_list, "align"=>"center", "width"=>"150px"),
51+
"order_shipping_status"=>array("header"=>"Shipping Status", "type"=>"progressbar", "show_value"=>false, "align"=>"center", "width"=>"200px"),
52+
"order_note"=>array("header"=>"Note", "type"=>"label", "align"=>"left", "width"=>""),
53+
);
54+
55+
// Config settings, optional
56+
$config = array("page_size"=> 5);
57+
58+
// Set the grid
59+
$this->smartgrid->set_grid($data_list, $columns, $config);
60+
61+
// Render the grid and assign to data array, so it can be print to on the view
62+
$data['grid_html'] = $this->smartgrid->render_grid();
63+
64+
// Load view
65+
$this->load->view('example_smartgrid_arraygrid', $data);
66+
}
67+
}

‎application/libraries/SmartGrid/Smartgrid.php‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -300,8 +300,8 @@ private function render_rows()
300300
<small class="pull-left">'.(($field_value > 0) ? $field_value : "").'</small>
301301
</div>';
302302
}
303-
$html .= '<div class="progress xs" style="height: 10px;">
304-
<div class="progress-bar" role="progressbar" aria-valuenow="'.$progress_value.'" aria-valuemin="0" aria-valuemax="'.$field_maximum_value.'" style="min-width: 1em; width: '.$progress_value.'%;"></div>
303+
$html .= '<div class="progress xs" style="height: 10px;" title="'.$field_value.'">
304+
<div class="progress-bar" role="progressbar" aria-valuenow="'.$progress_value.'" aria-valuemin="0" aria-valuemax="'.$field_maximum_value.'" style="width: '.$progress_value.'%;"></div>
305305
</div>';
306306
break;
307307
case "enum":
@@ -326,7 +326,7 @@ private function render_rows()
326326
$html .= $this->get_relative_date($field_value);
327327
break;
328328
case "html":
329-
$html .= htmlentities($field_value);
329+
$html .= '<code>'.htmlentities($field_value).'</code>';
330330
break;
331331
case "link":
332332
if(!empty($field_value)){

‎application/views/example_smartgrid.php‎

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -9,24 +9,24 @@
99
</head>
1010
<body>
1111

12-
<div class="container">
13-
<div class="page-header">
14-
<h1>SmartGrid for CodeIgniter with Bootstrap - Example</h1>
15-
</div>
16-
17-
<form class="form-inline" method="POST">
18-
<div class="form-group">
19-
<label for="employee_name">Employee Name</label>
20-
<input type="text" class="form-control" id="employee_name" name="employee_name" placeholder="Employee Name" value="<?php echo trim($this->input->get_post('employee_name', TRUE)); ?>">
12+
<div class="container">
13+
<div class="page-header">
14+
<h1>SmartGrid for CodeIgniter with Bootstrap - Example</h1>
2115
</div>
22-
<button type="submit" class="btn btn-default">Search</button>
23-
</form>
24-
<hr />
25-
26-
<?php echo isset($grid_html1) ? $grid_html1 : ''; ?>
27-
28-
<?php echo isset($grid_html2) ? $grid_html2 : ''; ?>
29-
</div>
16+
17+
<form class="form-inline" method="POST">
18+
<div class="form-group">
19+
<label for="employee_name">Employee Name</label>
20+
<input type="text" class="form-control" id="employee_name" name="employee_name" placeholder="Employee Name" value="<?php echo trim($this->input->get_post('employee_name', TRUE)); ?>">
21+
</div>
22+
<button type="submit" class="btn btn-default">Search</button>
23+
</form>
24+
<hr />
25+
26+
<!-- Print the SmartGrid html -->
27+
<?php echo isset($grid_html) ? $grid_html : ''; ?>
28+
29+
</div>
3030

3131
</body>
3232
</html>

‎application/views/example_smartgrid_arraygrid.php‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<?php
2+
defined('BASEPATH') OR exit('No direct script access allowed');
3+
?><!DOCTYPE html>
4+
<html lang="en">
5+
<head>
6+
<meta charset="utf-8">
7+
<title>SmartGrid for CodeIgniter - Example with DataTables</title>
8+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
9+
</head>
10+
<body>
11+
12+
<div class="container">
13+
<div class="page-header">
14+
<h1>SmartGrid for CodeIgniter with Bootstrap - Example array grid</h1>
15+
</div>
16+
17+
<?php echo isset($grid_html) ? $grid_html : ''; ?>
18+
<br />
19+
</div>
20+
21+
</body>
22+
</html>

‎application/views/smartgrid_and_datatables.php‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<?php
2+
defined('BASEPATH') OR exit('No direct script access allowed');
3+
?><!DOCTYPE html>
4+
<html lang="en">
5+
<head>
6+
<meta charset="utf-8">
7+
<title>SmartGrid for CodeIgniter - Example with DataTables</title>
8+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
9+
10+
<!-- Styles for datatables -->
11+
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css">
12+
</head>
13+
<body>
14+
15+
<div class="container">
16+
<div class="page-header">
17+
<h1>SmartGrid for CodeIgniter with Bootstrap - Example with DataTables</h1>
18+
</div>
19+
20+
<!-- Print the SmartGrid html -->
21+
<?php echo isset($grid_html) ? $grid_html : ''; ?>
22+
<br />
23+
</div>
24+
25+
<!-- JQuery include -->
26+
<script type="text/javascript" src="//code.jquery.com/jquery-1.12.3.js"></script>
27+
<!-- Javascrips for datatables -->
28+
<script type="text/javascript" src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
29+
<script type="text/javascript" src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script>
30+
<!-- Now make the SmartGrid work with datatables
31+
'sg-table' is the id of the main table in SmartGrid -->
32+
<script type="text/javascript">
33+
$(document).ready(function() {
34+
$('#sg-table').DataTable();
35+
});
36+
</script>
37+
</body>
38+
</html>

0 commit comments

Comments
 (0)