Roh*_*ale 6 angularjs angular-ui-grid
我想在现有网格中添加一个新行.此外,正在推送的行应该是可编辑的.
我在代码下面累了,行已经添加了,但我希望添加可编辑的字段
$scope.addNewItem=function() {
$scope.data.push( { name: 'Test add ' });
};
有人可以帮助我吗？
试试这个样本
这是完整的源代码
<!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>
控制器和模块代码
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' });
};
}]);
| 归档时间： |
|
| 查看次数： |
18158 次 |
| 最近记录： |