Skip to content

Instantly share code, notes, and snippets.

@samirbr
Last active August 29, 2015 14:23
Show Gist options
  • Save samirbr/8f99379ded494e9ccdb9 to your computer and use it in GitHub Desktop.
Save samirbr/8f99379ded494e9ccdb9 to your computer and use it in GitHub Desktop.
.gridStyle {
border: 1px solid rgb(212,212,212);
width: 400px;
height: 300px;
}
<html ng-app="myApp">
<head lang="en">
<meta charset="utf-8">
<title>Getting Started With ngGrid Example</title>
<link rel="stylesheet" type="text/css" href="bower_components/ng-grid/ng-grid.css">
<link rel="stylesheet" type="text/css" href="app.css">
<!-- sem REST -->
<script>
var questions = {{ questions|safe }},
harvests = {{ harvest_json|safe }};
</script>
<!-- sem REST ends -->
</head>
<body ng-controller="MyCtrl">
<div class="gridStyle" ng-grid="gridOptions"></div>
</body>
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/angular-resource/angular-resource.min.js"></script>
<script src="bower_components/ng-grid/ng-grid-2.0.14.min.js"></script>
<script src="app.js"></script>
<script src="harvest.js"></script>
</html>
var app = angular.module('myApp', ['ngGrid', 'ngResource']);
app.controller('MyCtrl', [ '$scope', 'Harvest', function($scope, Harvest) {
$scope.myData = []
// sem REST
// filtragem aqui
var data = [];
harvests.filter(function(harvest) {
var question;
// use Array.prototype.filter
question = questions.filter(function (question) {
// supondo harvest.question ==> id da questao
// do contrario use harvest.question.id
return harvest.question == question.id;
}).pop();
data.push({
uuid: harvest.uuid,
date: harvest.date,
device: this.device,
question: question.name;
});
});
$scope.myData = data;
// com REST
Harvest.query({paramKey: paramValue}, function (harvests) {
// filtragem aqui
var data = [];
harvests.filter(function(harvest) {
data.push({
uuid: harvest.uuid,
date: harvest.date,
device: harvest.device,
question: harvest.question.name;
});
});
$scope.myData = data;
}]);
$scope.$on('ngGridEventEndCellEdit', function (event) {
// tem que verificar se isso funciona
var harvest = new Harvest(event.data);
if (!harvest.id) {
harvest.$save(function (event) {
console.log(event);
});
} else {
harvest.$update(function (event) {
console.log(event);
});
}
});
$scope.gridOptions = {
data: 'myData',
enableCellSelection: true,
enableRowSelection: false,
enableCellEditOnFocus: true,
columnDefs: [{field: 'name', displayName: 'Name', enableCellEdit: true},
{field:'age', displayName:'Age', enableCellEdit: true}]
};
});
{
"name": "harvest-data",
"version": "0.0.1",
"authors": [
"Samir <[email protected]>",
"Fred <[email protected]>"
],
"description": "Edit Harvest data",
"main": "app.js",
"moduleType": [
"es5"
],
"keywords": [
"harvest",
"grid",
"data"
],
"license": "none",
"dependencies": {
"jquery": "1.8.*",
"angular": "1.3.6",
"ng-grid": "2.0.14"
},
"devDependencies": {
},
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests"
]
}
angular.module('myApp')
.factory('Harvest', [
'$resource',
function ($resource) {
return $resource('/api/harvests/?id', {'id': '@id'});
}
]);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment