editableCellTemplate and enableCellEditOnFocus not working together
So we have an issue where we need to use an editableCellTemplate and need enableCellEditOnFocus together. However it seems that they are not working together correctly. The Next row receives focus but the caret/cursor isn't there. CellNav and edit are both enabled and it works on 'non-templated' cells. Is there something I can add to the template to allow it to edit on focus?
Cell Template (new to commenting on github had to get rid of the </>): editableCellTemplate: input id="editBtn" type="string" ng-model="MODEL_COL_FIELD" ng-enter="grid.appScope.edit(row)"
Edit: the edit on focus also works if I add ui-grid-editor to the template options but prevents the ng-enter event from firing.
I have same problem. steps to reproduce:
- click on cell under ID column
- click on cell under name column (single click to edit, works good)
- click on cell under ID column
- click on cell under Type column, (requires double click, needs to be single click)
Plunker here: http://plnkr.co/edit/NlSpTHwufZm2Ru5XVIQ9?p=preview
@PaulL1 : Facing the problem of single click.
Initially my code works for single click to edit the custom dropdown but on the second time ,I need to double click it for editing .
I always want a single click for my custom dropdown (no double-clicks to edit). What I have tried - I have used enableCellEditOnFocus: true on the gridOptions level. I wrote my own dropdown cellTemplate and used ng-click which calls a method . I am performing some operation on the method called and broadcasting the END_CELL_EDIT event as $rootScope.$broadcast(uiGridEditConstants.events.END_CELL_EDIT); to hide the dropdown from the cell Template.
On the first click , the single clicks work but secondly I need to double click to edit the dropdown. What could be the reason.?
My input will receive focus with just a single click when using only a cellTemplate, and not an editableCellTemplate. The only problem I have with this approach, is that my input is part of a more complex custom control that does not render or behave the same in a cellTemplate as it does in an editableCellTemplate. If I set the editableCellTemplate identical to the cellTemplate, the enableCellEditOnFocus functionality does not work - I need an extra click, not a double-click, for the editable cell template to receive focus, at least initially. Subsequent clicking between rows only requires single clicks after that. User's response is "I can't edit".
<div ui-grid="vm.room.tenantGridOptions" ui-grid-auto-resize ui-grid-edit ui-grid-cellnav></div>
columnDef = {};
columnDef.field = "partial_room_nsf";
columnDef.type = "number";
columnDef.headerCellTemplate = "<div style='word-wrap: break-word;'>Assigned NSF</div>";
columnDef.cellTemplate = "<div><custom-text-box type='number' ng-model=\"row.entity.partial_room_nsf\" custom-validate-expression=\"row.entity.validateTenant()\" /></div>";
columnDef.editableCellTemplate = "<div><custom-text-box type='number' ng-model=\"row.entity.partial_room_nsf\" custom-validate-expression=\"row.entity.validateTenant()\" /></div>";
columnDef.enableCellEditOnFocus = true;
columnDef.enableHiding = false;
Any update on this issue? Did any one manage to solve this?
Hi guys, we are having the same issue too. The users are mislead to an idea that they cannot edit the cell. Any update is appreciated :-)