Bootstrap Grid Layout

Tue, 02 Apr 2019 22:09:23 +0000

The datagrid can also be displayed and positioned easily in a Bootstrap Grid System layout, uses a series of containers, rows, and columns to the layout that is fully responsive.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

<div class="container">
<div class="row">
<div class="col-md-4">.col-md-4div>
<div class="col-md-4">.col-md-4

use phpCtrl\C_DataGrid;
require_once("/file/path/to/conf.php");

$dg = new C_DataGrid("SELECT * FROM orders", "orderNumber", "orders");
$dg -> set_theme('bootstrap');
$dg -> display();
?>
div>
<div class="col-md-4">.col-md-4div>
div>
div>

See Live Example!

The post Bootstrap Grid Layout appeared first on phpGrid - PHP Datagrid.

Multiple Datagrids Side by Side

Tue, 09 Sep 2014 22:02:46 +0000

When having multiple datgagrids on a page, it’s common you need to change the default top to bottom layout. The following code snippet shows how to use simple CSS to change layout to side by side.

Make sure to give enough width to datagrid container so that the grids won’t wrap.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

<div id="bigcontainer">

<div id="dg1">

$dg = new C_DataGrid("SELECT * FROM orders", "orderNumber", 'orders');
$dg->enable_edit("FORM", "CRUD");
$dg->display();
?>
div>

<div id="dg2">

$dg2 = new C_DataGrid("select * from employees", "employeeNumber", "employees");
$dg2->enable_edit("FORM", "CRUD");
$dg2->display();
?>
div>

<div id="dg3">

$dg3 = new C_DataGrid("select * from offices", "officeCode", "offices");
$dg3->enable_edit("FORM", "CRUD");
$dg3->display();
?>
div>

div>

<style>
div#bigcontainer{
width: 5000px;
}
div#dg1, div#dg2, div#dg2, div#dg3{
float:left;
}
style>

Multiple datagrids side by side live demo!

The post Multiple Datagrids Side by Side appeared first on phpGrid - PHP Datagrid.

Layout Archives | phpGrid - PHP Datagrid

Bootstrap Grid Layout

Multiple Datagrids Side by Side