CELL edit with Add, Delete and Export buttons

Tue, 21 May 2019 22:55:07 +0000

phpGrid has a less known edit feature called “CELL”. It’s similar to INLINE edit, but with only a single editable cell when selected. This is not a fully-fledged feature from jqGrid itself, especially it missed add and delete out of the box. However, we have hacked (but works) Javascript to included the add and delete functions through custom javascript.

Pay close attention to the “url” property. Be sure it points to a valid edit.php address.

1
2
3
4
5
6
7
8

// Always include namespace and conf.php on TOP of the script.
use phpCtrl\C_DataGrid;
require_once("/file/path/to/conf.php");

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

ADD & DELETE

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

$(function() {

$('#addNew').on('click', function(){
$("#orders").jqGrid('editGridRow', "new", {url:'/phpGrid/edit.php?dt=json&gn=orders&oper=add'} );
});

$('#delRow').on('click', function(){
var selRowId = $("#orders").jqGrid('getGridParam', 'selrow');
$.ajax({
url: '/phpGrid/edit.php?dt=json&gn=orders',
data: {'id': selRowId, 'oper': 'del'},
type: 'POST',
dataType: 'JSON'
});
$('#orders').trigger( 'reloadGrid' );
});
})
<button id="addNew">Add Newbutton>
<button id="delRow">Delete Selectedbutton>

See Live Example!

EXPORT (new)

To add Export buttons to the bottom toolbar, insert the following BEFORE $dg->$display(); Be sure to replace /phpGrid/ with the actual phpGrid absolute file path on your web server

1
2
3
4
5
6
7
8
9
10
11
12

$exportDropdown =<<< EXPORTDROPDOWN
$('#orders_pager1_left').append (`

Export:

`);
EXPORTDROPDOWN;
$dg->before_script_end = $exportDropdown;

The post CELL edit with Add, Delete and Export buttons appeared first on phpGrid - PHP Datagrid.

CELL edit Archives | phpGrid - PHP Datagrid

CELL edit with Add, Delete and Export buttons

ADD & DELETE

EXPORT (new)