I wanted to add a new row into my existing grid. Also, the row which is getting pushed should be editable.
I tired below code and the row is getting added, But I wanted editable fields to be added
$scope.addNewItem=function() {
$scope.data.push( { name: 'Test add ' });
};
Can someone help me for the same.
Try this sample
This is full source code
<!doctype html>
<html ng-app="app">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular-touch.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular-animate.js"></script>
<script src="http://ui-grid.info/docs/grunt-scripts/csv.js"></script>
<script src="http://ui-grid.info/docs/grunt-scripts/pdfmake.js"></script>
<script src="http://ui-grid.info/docs/grunt-scripts/vfs_fonts.js"></script>
<script src="http://ui-grid.info/release/ui-grid-unstable.js"></script>
<link rel="stylesheet" href="http://ui-grid.info/release/ui-grid-unstable.css" type="text/css">
</head>
<body>
<div ng-controller="MainCtrl">
<div ui-grid="{ data: data, columnDefs: columnDefs,enableRowSelection: true,
enableSelectAll: true,
enableFiltering: true, }" class="grid" ui-grid-selection ui-grid-edit ui-grid-cellnav></div>
<button ng-click="addNewItem()" > ADD item</button>
<button ng-click="insertNewItem()" > Insert item</button>
</div>
<script src="app.js"></script>
</body>
</html>
controller and module code
var app = angular.module('app', ['ngAnimate', 'ngTouch', 'ui.grid', 'ui.grid.selection', 'ui.grid.edit','ui.grid.cellNav']);
app.controller('MainCtrl', ['$scope', function ($scope) {
$scope.data = [
{ name: 'Bob', title: 'CEO' },
{ name: 'Frank', title: 'Lowly Developer' }
];
$scope.columnDefs = [
{name: 'name', cellEditableCondition:true},
{name: 'title', cellEditableCondition:true}
];
$scope.addNewItem=function()
{
$scope.data.push( { name: 'Test add ', title: 'Test add' });
};
$scope.insertNewItem=function()
{
$scope.data.splice(1, 0, { name: 'Test insert ', title: 'Test insert' });
};
}]);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With