edit Archives | phpGrid - PHP Datagrid

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.

set_jq_editurl()

Wed, 15 Sep 2010 19:15:21 +0000

Parameter(s):
- $url: URL
Description:
- Manually set URL used for editing. The default URL is edit.php. phpGrid takes care all of data insert, delete, and update in edit.php. No coding is required.
Remark:
- Only use this method when the users need to manually handle data update using custom save routine.
- It’s the same as setting the 3rd parameter in enable_edit() method.

The post set_jq_editurl() appeared first on phpGrid - PHP Datagrid.

enable_edit() *

Tue, 14 Sep 2010 07:50:23 +0000

* Please note this feature is only available in paid versions. CELL edit is only available in the commercial licenses

Parameters:
- $edit_mode: FORM, INLINE, or CELL. The default is FORM.
- $operations: specify allowed datagrid edit operations. By default, all edit operations are allowed.
  - C = Create
  - R = Review
  - U = Update
  - D = Delete
- $edit_file: Optional. Use a custom edit file other than the default “edit.php”. Do not set this parameter unless you ABSOLUTELY know what you are doing!
Description:
- When Form edit mode is used, additional icons appear in the data grid footer used for editing. When set to inline mode, the cells in the selected row become editable when the row is clicked. Only a single row can be edited for either mode.
Remark:
- Multiple records can be deleted when multiple select is enabled. See set_multiselect() for more information on this method.
- For inline edit, the user must press Enter key to save changes
- In FORM edit mode, double click triggers the popup edit window to display. In INLINE edit it is a single click to edit, similar to how Excel works. This is a design decision.
- When edit mode set to ‘CELL’, the datagrid will behave like an Excel spreadsheet. It is advisable to also enable keyboard navigation with enable_kb_nav().
Example:

1	$dg -> enable_edit('FORM', 'CRU'); // Everything is allowed but delete

It’s also possible to load a custom form in an iframe in a modal window with your own custom CRUD scripts.

Quick Tip: Keep the edit form open after submit

To keep form open after submit, add the following javascript to override ‘closeAfterEdit’ value before . Double click to edit a row, and form will remain open after edit.

Replace “orders” with your table name.

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

jQuery(document).ready(function($){
var grid = $('#orders')[0];
$(grid).jqGrid('setGridParam',{
ondblClickRow: function(rowid) {
$(this).jqGrid('editGridRow', rowid,
{ recreateForm:true,
closeAfterEdit:false,
closeOnEscape:true,
reloadAfterSubmit:false})
}
});
});

The post enable_edit() * appeared first on phpGrid - PHP Datagrid.