I am facing a problem in ng-grid edit cells. When i double clicked the cell and started to typing ... i can't type more than one characted or number ! here is link http://plnkr.co/edit/P3iujTWmQCwEDolcaPwC?p=preview
Any suggestion ? http://plnkr.co/edit/P3iujTWmQCwEDolcaPwC?p=preview
var app = angular.module('myApp', [ 'ngGrid' ]);
app
.controller(
'MyCtrl',
function($scope) {
var name;
var age;
var birthday;
var salary;
var x;
$scope.submit = function() {
name = $scope.name;
age = $scope.age;
birthday = $scope.birthday;
salary = $scope.salary;
$scope.myData.push({
name : name,
age : age,
birthday : birthday,
salary : salary
});
// $scope.myData = $scope.myData +x;
};
$scope.myData = [ {
name : "Moroni",
age : 50,
birthday : "Oct 28, 1970",
salary : "60,000"
}, {
name : "Tiancum",
age : 43,
birthday : "Feb 12, 1985",
salary : "70,000"
}, {
name : "Jacob",
age : 27,
birthday : "Aug 23, 1983",
salary : "50,000"
}, {
name : "Nephi",
age : 29,
birthday : "May 31, 2010",
salary : "40,000"
}, {
name : "Enos",
age : 34,
birthday : "Aug 3, 2008",
salary : "30,000"
}, {
name : "Moroni",
age : 50,
birthday : "Oct 28, 1970",
salary : "60,000"
}, {
name : "Tiancum",
age : 43,
birthday : "Feb 12, 1985",
salary : "70,000"
}, {
name : "Jacob",
age : 27,
birthday : "Aug 23, 1983",
salary : "40,000"
}, {
name : "Nephi",
age : 29,
birthday : "May 31, 2010",
salary : "50,000"
}, {
name : "Enos",
age : 34,
birthday : "Aug 3, 2008",
salary : "30,000"
}, {
name : "Moroni",
age : 50,
birthday : "Oct 28, 1970",
salary : "60,000"
}, {
name : "Tiancum",
age : 43,
birthday : "Feb 12, 1985",
salary : "70,000"
}, {
name : "Jacob",
age : 27,
birthday : "Aug 23, 1983",
salary : "40,000"
}, {
name : "Nephi",
age : 29,
birthday : "May 31, 2010",
salary : "50,000"
}, {
name : "Enos",
age : 34,
birthday : "Aug 3, 2008",
salary : "30,000"
} ];
$scope.gridOptions = {
data : 'myData',
pagingOptions : $scope.pagingOptions,
enablePinning : true,
enablePaging : true,
columnDefs : [
{
field : "name",
width : 220,
pinned : true,
enableCellEdit : true
},
{
field : "age",
width : 200,
enableCellEdit : true
},
{
field : "birthday",
width : 200,
enableCellEdit : true
},
{
field : "salary",
width : 220,
enableCellEdit : true,
cellTemplate :basicCellTemplate
},
{
field : "Action",
width : 200,
enableCellEdit : false,
cellTemplate : '<button id="editBtn" type="button" class="btn btn-xs btn-info" ng-click="saveItem(row.entity.name, row.entity.surname,row.entity.address)" >Save</button>'
} ]
};
$scope.selectedCell;
$scope.selectedRow;
$scope.selectedColumn;
$scope.editCell = function (row, cell, column){
$scope.selectedCell = cell;
$scope.selectedRow = row;
$scope.selectedColumn = column;
};
$scope.updateCell = function(){
$scope.selectedRow[$scope.selectedColumn] = $scope.selectedCell;
};
var basicCellTemplate = '<div class="ngCellText" ng-class="col.colIndex()" ng-click="editCell(row.entity, row.getProperty(col.field), col.field)"><span class="ui-disableSelection hover">{{row.getProperty(col.field)}}</span></div>';
$scope.filterOptions = {
filterText : "",
useExternalFilter : true
};
$scope.gridOptions.sortInfo = {
fields : [ 'name', 'age' ],
directions : [ 'asc' ],
columns : [ 0, 1 ]
};
$scope.totalServerItems = 0;
$scope.pagingOptions = {
pageSizes : [ 5, 10, 20 ],
pageSize : 5,
currentPage : 1
};
$scope.setPagingData = function(data, page,
pageSize) {
var pagedData = data.slice((page - 1)
* pageSize, page * pageSize);
$scope.myData = pagedData;
$scope.totalServerItems = data.length;
if (!$scope.$$phase) {
$scope.$apply();
}
};
});`