How do I make angular-ui cell editable on single click?
14,482
Editing on single click is automatically added if you use ui-grid's navigation and set enableCellEditOnFocus
to true
in your gridOptions
.
Just add ui-grid-cellNav
to your grid's <div>
.
The only thing I don't know is if it's compatible with ui-grid-row-edit
.
Anyhow take a look at this tutorial to know more.
![immirza](https://i.stack.imgur.com/AuFyu.jpg?s=256&g=1)
Author by
immirza
Updated on July 20, 2022Comments
-
immirza almost 2 years
I am trying to make
angular ui-grid cell editable (row)
cell editable onsingle click.
Right Now, Cell becomes editable on double click.
How do I make cell editable on single click?
HTML:
<div class="grid testGrid" ui-grid="testGridOptions" ui-grid-edit ui-grid-row-edit style="width: 100%;"> </div>
Controller:
var columns = [ { field: 'Name', displayName: 'Name', cellEditableCondition: function ($scope) { return $scope.row.entity.showRemoved; } } ];
Grid options:
$scope.testGridOptions = { enableRowSelection: false, enableRowHeaderSelection: false, enableCellEdit: true, enableCellEditOnFocus: false, enableSorting: false, enableFiltering: false, multiSelect: false, rowHeight: 30, enableColumnMenus: false, enableGridMenu: false, showGridFooter: false, onRegisterApi: function (gridApi) { $scope.gridApi = gridApi; } };
-
Bart about 8 yearsIt IS compatible. I just added the
gridOptions: { enableCellEditOnFocus: true }
on a<div ui-grid="vm.gridOptions" ui-grid-cellNav ui-grid-edit ui-grid-row-edit ...>
. The only thing is that for the first edit I still have to double click, only thereafter does single clicking (now) suffice.