<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-touch.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/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.js"></script>
<link rel="stylesheet" href="http://ui-grid.info/release/ui-grid.css" type="text/css">
<link rel="stylesheet" href="main.css" type="text/css">
<script src="script.js"></script>
</head>
<body ng-app="geh" ng-controller="home">
<div id="grid1" ui-grid="gridOptions" ui-grid-edit ui-grid-auto-resize ui-grid-cellNa class="grid"></div>
</body>
</html>
var app = angular.module("geh", ['ui.grid', 'ui.grid.edit', 'ui.grid.cellNav', 'ui.grid.autoResize', 'ui.grid.rowEdit']);
app.controller('home', function($scope, $http) {
$scope.map = [{
'id': 1,
'value': 'test1'
}]
$scope.gridOptions = {
enableCellEditOnFocus: true,
enableFiltering: true,
onRegisterApi: function(gridApi) {
$scope.gridApi = gridApi;
},
columnDefs: [{
field: 'name'
}, {
field: 'gender'
}, {
field: 'sindicato'
}, {
field: 'value',
width: 500,
editableCellTemplate: 'ui-grid/dropdownEditor',
editDropdownIdLabel: 'id',
editDropdownValueLabel: 'value',
editDropdownOptionsArray: 'periodos',
cellFilter: 'griddropdown:row.entity'
}]
};
$scope.gridOptions.onRegisterApi = function(gridApi) {
$scope.gridApi = gridApi;
};
$scope.data = [{
'id_a': 1,
'sindicato': 1,
'name': 'SI',
'gender': 'P'
}, {
'id_a': 2,
'sindicato': 2,
'name': 'SI_2',
'gender': 'P_2'
}, {
'id_a': 3,
'sindicato': 1,
'name': 'SI_3',
'gender': 'P_3'
}, {
'id_a': 4,
'sindicato': 3,
'name': 'SI_4',
'gender': 'P_4'
}];
$scope.gridOptions.data = $scope.data;
}).filter('griddropdown', function() {
return function(input, context) {
console.log(context);
if (context.sindicato === 1) {
periodos = {
'id': 1,
'value': 'teste1'
};
} else if (context.sindicato === 2) {
periodos = [{
'id': 2,
'value': 'test2'
}, {
'id': 5,
'value': 'test5'
}];
} else {
periodos = [{
'id': 3,
'value': 'test3'
}, {
'id': 6,
'value': 'test6'
}, {
'id': 4,
'value': 'test4'
}];
}
return periodos
}
});
/* Styles go here */