+
\ No newline at end of file
diff --git a/src/features/expandable/js/expandable.js b/src/features/expandable/js/expandable.js
index ad5345d368..36b0eac293 100644
--- a/src/features/expandable/js/expandable.js
+++ b/src/features/expandable/js/expandable.js
@@ -1,29 +1,149 @@
(function () {
'use strict';
+ /**
+ * @ngdoc overview
+ * @name ui.grid.expandable
+ * @description
+ *
+ * # ui.grid.expandable
+ * This module provides the ability to create subgrids with the ability to expand a row
+ * to show the subgrid.
+ *
+ *
+ */
var module = angular.module('ui.grid.expandable', ['ui.grid']);
+ /**
+ * @ngdoc service
+ * @name ui.grid.edit.service:uiGridExpandableService
+ *
+ * @description Services for the expandable grid
+ */
module.service('uiGridExpandableService', ['gridUtil', '$log', '$compile', function (gridUtil, $log, $compile) {
var service = {
initializeGrid: function (grid) {
+
+ /**
+ * @ngdoc object
+ * @name enableExpandable
+ * @propertyOf ui.grid.expandable.api:GridOptions
+ * @description Whether or not to use expandable feature, allows you to turn off expandable on specific grids
+ * within your application, or in specific modes on _this_ grid. Defaults to true.
+ * @example
+ *
+ * $scope.gridOptions = {
+ * enableExpandable: false
+ * }
+ *
+ */
+ grid.options.enableExpandable = grid.options.enableExpandable !== false;
+
+ /**
+ * @ngdoc object
+ * @name expandableRowHeight
+ * @propertyOf ui.grid.expandable.api:GridOptions
+ * @description Height in pixels of the expanded subgrid. Defaults to
+ * 150
+ * @example
+ *
+ * $scope.gridOptions = {
+ * expandableRowHeight: 150
+ * }
+ *
+ */
+ grid.options.expandableRowHeight = grid.options.expandableRowHeight || 150;
+
+ /**
+ * @ngdoc object
+ * @name expandableRowTemplate
+ * @propertyOf ui.grid.expandable.api:GridOptions
+ * @description Mandatory. The template for your expanded row
+ * @example
+ *
+ * $scope.gridOptions = {
+ * expandableRowTemplate: 'expandableRowTemplate.html'
+ * }
+ *
+ */
+ if ( grid.options.enableExpandable && !grid.options.expandableRowTemplate ){
+ gridUtil.logError( 'You have not set the expandableRowTemplate, disabling expandable module' );
+ grid.options.enableExpandable = false;
+ }
+
+ /**
+ * @ngdoc object
+ * @name ui.grid.expandable.api:PublicApi
+ *
+ * @description Public Api for expandable feature
+ */
+ /**
+ * @ngdoc object
+ * @name ui.grid.expandable.api:GridOptions
+ *
+ * @description Options for configuring the expandable feature, these are available to be
+ * set using the ui-grid {@link ui.grid.class:GridOptions gridOptions}
+ */
+
var publicApi = {
events: {
expandable: {
+ /**
+ * @ngdoc event
+ * @name rowExpandedStateChanged
+ * @eventOf ui.grid.expandable.api:PublicApi
+ * @description raised when cell editing is complete
+ *
+ * gridApi.expandable.on.rowExpandedStateChanged(scope,function(row){})
+ *
+ * @param {GridRow} row the row that was expanded
+ */
rowExpandedStateChanged: function (scope, row) {
}
}
},
+
methods: {
expandable: {
+ /**
+ * @ngdoc method
+ * @name toggleRowExpansion
+ * @methodOf ui.grid.expandable.api:PublicApi
+ * @description Toggle a specific row
+ *
+ * gridApi.expandable.toggleRowExpansion(rowEntity);
+ *
+ * @param {object} rowEntity the data entity for the row you want to expand
+ */
toggleRowExpansion: function (rowEntity) {
var row = grid.getRow(rowEntity);
if (row !== null) {
service.toggleRowExpansion(grid, row);
}
},
+
+ /**
+ * @ngdoc method
+ * @name expandAllRows
+ * @methodOf ui.grid.expandable.api:PublicApi
+ * @description Expand all subgrids.
+ *
+ * gridApi.expandable.expandAllRows();
+ *
+ */
expandAllRows: function() {
service.expandAllRows(grid);
},
+
+ /**
+ * @ngdoc method
+ * @name collapseAllRows
+ * @methodOf ui.grid.expandable.api:PublicApi
+ * @description Collapse all subgrids.
+ *
+ * gridApi.expandable.collapseAllRows();
+ *
+ */
collapseAllRows: function() {
service.collapseAllRows(grid);
}
@@ -33,11 +153,12 @@
grid.api.registerEventsFromObject(publicApi.events);
grid.api.registerMethodsFromObject(publicApi.methods);
},
+
toggleRowExpansion: function (grid, row) {
row.isExpanded = !row.isExpanded;
if (row.isExpanded) {
- row.height = row.grid.options.rowHeight + grid.options.expandable.expandableRowHeight;
+ row.height = row.grid.options.rowHeight + grid.options.expandableRowHeight;
}
else {
row.height = row.grid.options.rowHeight;
@@ -45,6 +166,7 @@
grid.api.expandable.raise.rowExpandedStateChanged(row);
},
+
expandAllRows: function(grid, $scope) {
angular.forEach(grid.renderContainers.body.visibleRowCache, function(row) {
if (!row.isExpanded) {
@@ -53,6 +175,7 @@
});
grid.refresh();
},
+
collapseAllRows: function(grid) {
angular.forEach(grid.renderContainers.body.visibleRowCache, function(row) {
if (row.isExpanded) {
@@ -65,6 +188,19 @@
return service;
}]);
+ /**
+ * @ngdoc object
+ * @name enableExpandableRowHeader
+ * @propertyOf ui.grid.expandable.api:GridOptions
+ * @description Show a rowHeader to provide the expandable buttons. If set to false then implies
+ * you're going to use a custom method for expanding and collapsing the subgrids. Defaults to true.
+ * @example
+ *
+ * $scope.gridOptions = {
+ * enableExpandableRowHeader: false
+ * }
+ *
+ */
module.directive('uiGridExpandable', ['$log', 'uiGridExpandableService', '$templateCache',
function ($log, uiGridExpandableService, $templateCache) {
return {
@@ -75,7 +211,7 @@
compile: function () {
return {
pre: function ($scope, $elm, $attrs, uiGridCtrl) {
- if (uiGridCtrl.grid.options.expandable.enableExpandableRowHeader ) {
+ if ( uiGridCtrl.grid.options.enableExpandableRowHeader !== false ) {
var expandableRowHeaderColDef = {name: 'expandableButtons', width: 40};
expandableRowHeaderColDef.cellTemplate = $templateCache.get('ui-grid/expandableRowHeader');
uiGridCtrl.grid.addRowHeaderColumn(expandableRowHeaderColDef);
@@ -101,7 +237,7 @@
compile: function () {
return {
pre: function ($scope, $elm, $attrs, uiGridCtrl) {
- gridUtil.getTemplate($scope.grid.options.expandable.rowExpandableTemplate).then(
+ gridUtil.getTemplate($scope.grid.options.expandableRowTemplate).then(
function (template) {
var expandedRowElement = $compile(template)($scope);
$elm.append(expandedRowElement);
@@ -132,7 +268,7 @@
$scope.expandableRow = {};
$scope.expandableRow.shouldRenderExpand = function () {
- var ret = $scope.colContainer.name === 'body' && $scope.row.isExpanded && (!$scope.grid.isScrollingVertically || $scope.row.expandedRendered);
+ var ret = $scope.colContainer.name === 'body' && $scope.grid.options.enableExpandable !== false && $scope.row.isExpanded && (!$scope.grid.isScrollingVertically || $scope.row.expandedRendered);
return ret;
};
diff --git a/src/features/expandable/templates/expandableRow.html b/src/features/expandable/templates/expandableRow.html
index b9c4c727b7..bf96257c98 100644
--- a/src/features/expandable/templates/expandableRow.html
+++ b/src/features/expandable/templates/expandableRow.html
@@ -1,4 +1,4 @@
\ No newline at end of file
+ , height: grid.options.expandableRowHeight + 'px'}">
\ No newline at end of file
diff --git a/src/features/expandable/templates/expandableScrollFiller.html b/src/features/expandable/templates/expandableScrollFiller.html
index 5798734149..95538cee12 100644
--- a/src/features/expandable/templates/expandableScrollFiller.html
+++ b/src/features/expandable/templates/expandableScrollFiller.html
@@ -1,9 +1,9 @@
\ No newline at end of file
diff --git a/src/features/expandable/test/expandable.spec.js b/src/features/expandable/test/expandable.spec.js
index a3152abfb4..b6da2974d1 100644
--- a/src/features/expandable/test/expandable.spec.js
+++ b/src/features/expandable/test/expandable.spec.js
@@ -10,20 +10,19 @@ describe('ui.grid.expandable', function () {
scope = $rootScope;
timeout = $timeout;
- scope.gridOptions = {};
+ scope.gridOptions = {
+ expandableRowTemplate: 'expandableRowTemplate.html',
+ expandableRowHeight: 150
+ };
scope.gridOptions.data = [
{ col1: 'col1', col2: 'col2' }
];
- scope.gridOptions.expandable = {
- rowExpandableTemplate: 'rowExpandableTemplate.html',
- expandableRowHeight: 150
- };
scope.gridOptions.onRegisterApi = function (gridApi) {
scope.gridApi = gridApi;
scope.grid = gridApi.grid;
};
- $httpBackend.when('GET', 'rowExpandableTemplate.html').respond("");
+ $httpBackend.when('GET', 'expandableRowTemplate.html').respond("");
element = angular.element('');
$timeout(function () {