Skip to content

Commit

Permalink
fix(edit): fix boolean edit issue on Firefox and Safari on macOS
Browse files Browse the repository at this point in the history
Add mousedown listener to ui.grid.edit.directive:uiGridEditor to disable
blur handler if the element is a checkbox, and then re-focus the
checkbox and enable the blur handler after a $timeout. This change is to
deal with Safari and Firefox behavior in macOS where clicking the
checkbox causes a blur event, and the value is not updated.

GitHub issues: #1785, #4778, #4782
  • Loading branch information
Umer Farooq committed Oct 26, 2016
1 parent 6dfed10 commit 2059db9
Showing 1 changed file with 15 additions and 4 deletions.
19 changes: 15 additions & 4 deletions src/features/edit/js/gridEdit.js
Original file line number Diff line number Diff line change
Expand Up @@ -966,9 +966,20 @@
});
}

$elm.on('blur', function (evt) {
$scope.stopEdit(evt);
// macOS will blur the checkbox when clicked in Safari and Firefox,
// to get around this, we disable the blur handler on mousedown,
// and then focus the checkbox and re-enable the blur handler after $timeout
$elm.on('mousedown', function(evt) {
if ($elm[0].type === 'checkbox') {
$elm.off('blur', $scope.stopEdit);
$timeout(function() {
$elm.focus();

This comment has been minimized.

Copy link
@nmccready

nmccready Jan 11, 2017

Contributor

This is a bug where it should be $elm[0].focus(); like on line 1146

$elm.on('blur', $scope.stopEdit);
});
}
});

$elm.on('blur', $scope.stopEdit);
});


Expand Down Expand Up @@ -1132,9 +1143,9 @@
//set focus at start of edit
$scope.$on(uiGridEditConstants.events.BEGIN_CELL_EDIT, function () {
$timeout(function(){
$elm[0].focus();
$elm[0].focus();
});

$elm[0].style.width = ($elm[0].parentElement.offsetWidth - 1) + 'px';
$elm.on('blur', function (evt) {
$scope.stopEdit(evt);
Expand Down

0 comments on commit 2059db9

Please sign in to comment.