// Return response in AG Grid expected format echo json_encode([ 'rows' => $rows, 'lastRow' => $totalRows ]); ?> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>AG Grid PHP Example</title> <script src="https://cdn.jsdelivr.net/npm/ag-grid-community@31.3.2/dist/ag-grid-community.min.js"></script> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ag-grid-community@31.3.2/styles/ag-grid.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ag-grid-community@31.3.2/styles/ag-theme-alpine.css"> <style> .ag-theme-alpine { height: 600px; width: 100%; } body { font-family: Arial, sans-serif; margin: 20px; } </style> </head> <body> <h2>AG Grid with PHP Backend</h2> <div id="myGrid" class="ag-theme-alpine"></div> <script> // Define columns const columnDefs = [ { field: 'id', headerName: 'ID', width: 80, filter: 'agNumberColumnFilter' }, { field: 'name', headerName: 'Name', width: 150, filter: 'agTextColumnFilter' }, { field: 'email', headerName: 'Email', width: 200, filter: 'agTextColumnFilter' }, { field: 'age', headerName: 'Age', width: 100, filter: 'agNumberColumnFilter' }, { field: 'country', headerName: 'Country', width: 120, filter: 'agTextColumnFilter' }, { field: 'salary', headerName: 'Salary', width: 150, filter: 'agNumberColumnFilter', valueFormatter: params => { return '$' + params.value?.toLocaleString(); } } ];
// ... same SQL building logic as above ...
// Execute main query $stmt = $pdo->prepare($sql); foreach ($params as $key => $value) { $stmt->bindValue($key, $value); } $stmt->execute(); $rows = $stmt->fetchAll(PDO::FETCH_ASSOC); ag-grid php example
// Get total row count $countSql = str_replace("SELECT * FROM", "SELECT COUNT(*) as total FROM", $sql); $stmt = $pdo->prepare($countSql); foreach ($params as $key => $value) { $stmt->bindValue($key, $value); } $stmt->execute(); $totalRows = $stmt->fetch(PDO::FETCH_ASSOC)['total'];
// Apply pagination $sql .= " LIMIT $limit OFFSET $startRow"; // Return response in AG Grid expected format
INSERT INTO users (name, email, age, country, salary) VALUES ('John Doe', 'john@example.com', 28, 'USA', 55000), ('Jane Smith', 'jane@example.com', 32, 'Canada', 65000), ('Carlos Mendez', 'carlos@example.com', 45, 'Mexico', 48000); <?php header('Content-Type: application/json'); header('Access-Control-Allow-Origin: *'); header('Access-Control-Allow-Methods: GET, POST'); $host = 'localhost'; $dbname = 'ag_grid_demo'; $username = 'root'; $password = '';
// Grid configuration const gridOptions = { columnDefs: columnDefs, rowModelType: 'serverSide', serverSideStoreType: 'partial', cacheBlockSize: 100, pagination: true, paginationPageSize: 100, enableSorting: true, enableFilter: true, animateRows: true, onGridReady: function(params) { params.api.setServerSideDatasource(dataSource); } }; meta name="viewport" content="width=device-width
switch ($filterType) { case 'text': if ($type === 'contains') { $sql .= " AND $field LIKE :{$field}_filter"; $params[":{$field}_filter"] = "%$filterValue%"; } elseif ($type === 'equals') { $sql .= " AND $field = :{$field}_filter"; $params[":{$field}_filter"] = $filterValue; } break;