Skip to content

Instantly share code, notes, and snippets.

@Ocramius

Ocramius/actions_cell_template.html

Forked from chukShirley/actions_cell_template.html
Last active August 29, 2015 14:11
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Ocramius/3252273c7ee0e11b5ba4 to your computer and use it in GitHub Desktop.
Save Ocramius/3252273c7ee0e11b5ba4 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
actions_cell_template.html
<div class="ngCellText" ng-class="col.colIndex()" style="padding-top:5px; padding-left:5px;">
<span ng-cell-text>
{{console.log(row)}}
{{row.getProperty(col.id)}}
<button type="button" class="btn btn-sm btn-default" title="Edit peddler">
<span class="glyphicon glyphicon-edit"></span>
</button>
<button type="button" class="btn btn-sm btn-default" title="Pricing forumulas" ng-click="viewPricingFormulas()">
<span class="glyphicon glyphicon-usd"></span>
</button>
</span>
</div>
Raw
app.php
<?php
require_once 'PHP/checkCredentials.php';
$pageTitle = 'Business Peddlers';
?>
<!DOCTYPE html>
<html lang="en" ng-app="Scrap">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Sabel Steel</title>
<!-- Favicon -->
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" href="favicon.ico" type="image/x-icon">
<!-- Bootstrap -->
<link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="bower_components/bootstrap/dist/css/bootstrap-theme.min.css" rel="stylesheet">
<!-- Angular UI Grid -->
<link rel="stylesheet" href="bower_components/angular-ui-grid/ui-grid.min.css">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<style type="text/css">
.ng-cloak {
opacity:0;
}
</style>
</head>
<body class="ng-cloak">
<?php include 'PHP/views/layouts/twbs-menu.phtml';?>
<div class="container" ng-controller="BusinessPeddlersCtrl" ui-view>
</div>
<script type="text/javascript" src="bower_components/jquery/dist/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="bower_components/angular/angular.min.js"></script>
<script type="text/javascript" src="bower_components/angular-ui-router/release/angular-ui-router.min.js"></script>
<script type="text/javascript" src="bower_components/angular-touch/angular-touch.min.js"></script>
<script type="text/javascript" src="bower_components/angular-ui-grid/ui-grid.min.js"></script>
<script type="text/javascript" src="app/common/models/peddlers-model.js"></script>
<script type="text/javascript" src="app/peddlers/peddlers.js"></script>
<script type="text/javascript" src="app/scrap-app.js"></script>
</body>
</html>
Raw
row_template.html
<div ng-click="getExternalScopes().viewPricingFormulas()" ng-repeat="col in colContainer.renderedColumns track by col.colDef.name" class="ui-grid-cell" ui-grid-cell>
</div>
Raw
scrap-app.js
angular.module('Scrap', ['ui.router', 'ui.grid', 'ngTouch'])
.config(function($stateProvider){
$stateProvider
.state('peddlers', {
url:'/peddlers',
templateUrl:'app/peddlers/peddlers.tmpl.html',
controller:'PeddlersCtrl',
/* children:[
{
name:'business',
templateUrl:'app/peddlers/businessPeddlers.tmpl.html',
controller:'BusinessPeddlersCtrl'
}
]*/
})
.state('businessPeddlers', {
url:'/peddlers/business',
templateUrl:'app/peddlers/businessPeddlers.tmpl.html',
controller:'BusinessPeddlersCtrl'
})
.state('businessPeddlersFormulas', {
url:'/peddlers/business/formulas',
templateUrl:'app/peddlers/businessPeddlers/formulas.tmpl.html',
controller:'BusinessPeddlerFormulasCtrl'
})
})
.controller('PeddlersCtrl', ['$http', '$scope', function($http, $scope){
$scope.pageTitle = 'Peddlers';
}])
.controller('BusinessPeddlersCtrl', ['$http','$scope', 'uiGridConstants', function($http, $scope, uiGridConstants){
$scope.pageTitle = 'Business Peddlers';
$scope.businessPeddlersGrid = {
enableRowSelection:true,
enableSelectAll:true,
enableSorting: true,
enableFiltering: true,
rowHeight:40,
columnDefs:[
// ID column
{ field: 'id', name: 'id', visible:false },
// Name column
{
field: 'name',
name: 'Name',
sort:{
direction:uiGridConstants.ASC,
priority:0
},
filter:{
condition: uiGridConstants.CONTAINS
},
width:'30%'
},
// Location column
{ name: 'Location', field: 'address.city-and-state', width:'20%'},
// Address column
{ name: 'Address', field: 'address.street', visible:false},
// City column
{ name: 'City', field: 'address.city', visible:false },
// State column
{ name: 'State', field: 'address.state', visible:false },
// Zip code column
{ name: 'Zip', field: 'address.zip', visible:false },
// Actions column
{
name: 'Actions',
width:'10%',
enableSorting:false,
enableFiltering:false,
cellTemplate:'app/partials/business-peddlers/grid/actions_cell_template.html'
}
],
rowTemplate: 'app/partials/business-peddlers/grid/row_template.html',
onRegisterApi: function(gridApi){
$scope.grid1Api = gridApi;
},
cellTemplate: 'app/partials/business-peddlers/grid/cell_template.html'
};
$http.get('PHP/BUSINESS_PEDDLERS.php').success(function(data){
$scope.businessPeddlersGrid.data = data;
});
$scope.viewPricingFormulas = function(){
console.log('test');
}
}])
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment