Skip to content

Commit

Permalink
fix(edit): Replacing with .
Browse files Browse the repository at this point in the history 
This will help with performance.
  • Loading branch information
@mportuga
Portugal, Marcelo authored and mportuga committed Jan 15, 2018
1 parent 076df71 commit 2d40955
Show file tree
Hide file tree
Showing 2 changed files with 36 additions and 34 deletions.
54 changes: 28 additions & 26 deletions misc/tutorial/201_editable.ngdoc
View file
Original file line number Diff line number Diff line change
Expand Up @@ -94,10 +94,12 @@ $scope.gridOptions.columnDefs = [
};
});

app.controller('MainCtrl', ['$scope', '$http', '$timeout', function ($scope, $http, $timeout) {
$scope.gridOptions = { };
app.controller('MainCtrl', function ($scope, $http, $timeout) {
var vm = this;

$scope.storeFile = function( gridRow, gridCol, files ) {
vm.gridOptions = { };

vm.storeFile = function( gridRow, gridCol, files ) {
// ignore all but the first file, it can only select one anyway
// set the filename into this column
gridRow.entity.filename = files[0].name;
Expand All @@ -106,15 +108,15 @@ $scope.gridOptions.columnDefs = [
var setFile = function(fileContent){
gridRow.entity.file = fileContent.currentTarget.result;
// put it on scope so we can display it - you'd probably do something else with it
$scope.lastFile = fileContent.currentTarget.result;
vm.lastFile = fileContent.currentTarget.result;
$scope.$apply();
};
var reader = new FileReader();
reader.onload = setFile;
reader.readAsText( files[0] );
};

$scope.gridOptions.columnDefs = [
vm.gridOptions.columnDefs = [
{ name: 'id', enableCellEdit: false, width: '10%' },
{ name: 'name', displayName: 'Name (editable)', width: '20%' },
{ name: 'age', displayName: 'Age' , type: 'number', width: '10%' },
Expand All @@ -126,9 +128,9 @@ $scope.gridOptions.columnDefs = [
{ name: 'registered', displayName: 'Registered' , type: 'date', cellFilter: 'date:"yyyy-MM-dd"', width: '20%' },
{ name: 'address', displayName: 'Address', type: 'object', cellFilter: 'address', width: '30%' },
{ name: 'address.city', displayName: 'Address (even rows editable)', width: '20%',
cellEditableCondition: function($scope){
return $scope.rowRenderIndex%2
}
cellEditableCondition: function(scope){
return scope.rowRenderIndex%2;
}
},
{ name: 'isActive', displayName: 'Active', type: 'boolean', width: '10%' },
{ name: 'pet', displayName: 'Pet', width: '20%', editableCellTemplate: 'ui-grid/dropdownEditor',
Expand All @@ -151,19 +153,19 @@ $scope.gridOptions.columnDefs = [
}
},
{ name: 'filename', displayName: 'File', width: '20%', editableCellTemplate: 'ui-grid/fileChooserEditor',
editFileChooserCallback: $scope.storeFile }
];
editFileChooserCallback: vm.storeFile }
];

$scope.msg = {};
vm.msg = {};

$scope.gridOptions.onRegisterApi = function(gridApi){
//set gridApi on scope
$scope.gridApi = gridApi;
gridApi.edit.on.afterCellEdit($scope,function(rowEntity, colDef, newValue, oldValue){
$scope.msg.lastCellEdited = 'edited row id:' + rowEntity.id + ' Column:' + colDef.name + ' newValue:' + newValue + ' oldValue:' + oldValue ;
$scope.$apply();
});
};
vm.gridOptions.onRegisterApi = function(gridApi) {
//set gridApi on scope
vm.gridApi = gridApi;
gridApi.edit.on.afterCellEdit($scope, function(rowEntity, colDef, newValue, oldValue) {
vm.msg.lastCellEdited = 'edited row id:' + rowEntity.id + ' Column:' + colDef.name + ' newValue:' + newValue + ' oldValue:' + oldValue ;
$scope.$apply();
});
};

$http.get('/data/500_complex.json')
.then(function(response) {
Expand All @@ -181,9 +183,9 @@ $scope.gridOptions.columnDefs = [
data[i].foo = {bar: [{baz: 2, options: [{value: 'dog'}, {value: 'cat'}]}]}
}
}
$scope.gridOptions.data = data;
vm.gridOptions.data = data;
});
}])
})

.filter('mapGender', function() {
var genderHash = {
Expand Down Expand Up @@ -218,15 +220,15 @@ $scope.gridOptions.columnDefs = [
});
</file>
<file name="index.html">
<div ng-controller="MainCtrl">
<strong>Data Length:</strong> {{ gridOptions.data.length | number }}
<div ng-controller="MainCtrl as $ctrl">
<strong>Data Length:</strong> {{ $ctrl.gridOptions.data.length | number }}
<br>
<strong>Last Cell Edited:</strong> {{msg.lastCellEdited}}
<strong>Last Cell Edited:</strong> {{$ctrl.msg.lastCellEdited}}
<br>
<div ui-grid="gridOptions" ui-grid-edit class="grid"></div>
<div ui-grid="$ctrl.gridOptions" ui-grid-edit class="grid"></div>
<br>
<div><strong>Last file uploaded:</strong></div>
<div>{{lastFile}}</div>
<div>{{$ctrl.lastFile}}</div>
</div>
</file>
<file name="main.css">
Expand Down
16 changes: 8 additions & 8 deletions src/features/edit/js/gridEdit.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -535,7 +535,7 @@
cellNavNavigateDereg = uiGridCtrl.grid.api.cellNav.on.navigate($scope, function (newRowCol, oldRowCol, evt) {
if ($scope.col.colDef.enableCellEditOnFocus) {
if (newRowCol.row === $scope.row && newRowCol.col === $scope.col && evt && (evt.type === 'click' || evt.type === 'keydown')) {
$timeout(function () {
$scope.$applyAsync(function () {
beginEdit(evt);
});
}
Expand Down Expand Up @@ -834,8 +834,8 @@
});

$scope.$broadcast(uiGridEditConstants.events.BEGIN_CELL_EDIT, triggerEvent);
$timeout(function () {
//execute in a timeout to give any complex editor templates a cycle to completely render
$scope.$applyAsync(function () {
// execute in a apply async to give any complex editor templates a cycle to completely render
$scope.grid.api.edit.raise.beginCellEdit($scope.row.entity, $scope.col.colDef, triggerEvent);
});
}
Expand Down Expand Up @@ -935,7 +935,7 @@

//set focus at start of edit
$scope.$on(uiGridEditConstants.events.BEGIN_CELL_EDIT, function (evt,triggerEvent) {
$timeout(function () {
$scope.$applyAsync(function () {
$elm[0].focus();
//only select text if it is not being replaced below in the cellNav viewPortKeyPress
if ($elm[0].select && ($scope.col.colDef.enableCellEditOnFocus || !(uiGridCtrl && uiGridCtrl.grid.api.cellNav))) {
Expand Down Expand Up @@ -1005,7 +1005,7 @@
$elm.on('click', function (evt) {
if ($elm[0].type !== 'checkbox') {
$scope.deepEdit = true;
$timeout(function () {
$scope.$applyAsync(function () {
$scope.grid.disableScrolling = true;
});
}
Expand Down Expand Up @@ -1136,8 +1136,8 @@
*
*/
module.directive('uiGridEditDropdown',
['uiGridConstants', 'uiGridEditConstants', '$timeout',
function (uiGridConstants, uiGridEditConstants, $timeout) {
['uiGridConstants', 'uiGridEditConstants',
function (uiGridConstants, uiGridEditConstants) {
return {
require: ['?^uiGrid', '?^uiGridRenderContainer'],
scope: true,
Expand All @@ -1152,7 +1152,7 @@

//set focus at start of edit
$scope.$on(uiGridEditConstants.events.BEGIN_CELL_EDIT, function () {
$timeout(function(){
$scope.$applyAsync(function(){
$elm[0].focus();
});

Expand Down

0 comments on commit 2d40955

Please sign in to comment.