fix(cellNav): If cellNav api exists, turn on stuff

c0bra · c0bra · commit 14264540c440 · 2015-01-29T16:02:41.000-06:00
There was a bug caused by a combination of cellNav and subgrids. If the parent grid had cellNav turned on but the subgrids didn't, they would still attach event handlers for cellNav because the directive was looking for the cellNav controller in its parent chain. It existed, but on the wrong grid. This change looks for the presence of the cellNav api in the Grid to turn on the event handlers. Fixes #2294
diff --git a/misc/demo/subgrid.html b/misc/demo/subgrid.html
@@ -0,0 +1,80 @@
+<!DOCTYPE html>
+<html class="no-js" ng-app="test"><!--<![endif]-->
+<head>
+    <meta charset="utf-8">
+    <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
+    <title></title>
+    <meta content="width=device-width" name="viewport">
+
+    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css" />
+    <link href="/dist/release/ui-grid.css" rel="stylesheet">
+
+    <script src="//code.jquery.com/jquery-2.1.3.min.js"></script>
+    <script src="/lib/test/angular/1.2.26/angular.js"></script>
+    <script src="/dist/release/ui-grid.js"></script>
+
+    <style>
+        body {
+            padding: 60px;
+            min-height: 600px;
+        }
+        .grid {
+            width: 500px;
+            height: 400px;
+        }
+        .placeholder {
+            height: 50%;
+            width: 50%;
+            border: 3px solid black;
+            background: #ccc;
+        }
+    </style>
+</head>
+<body ng-controller="Main">
+<!-- <h1>Test</h1> -->
+
+<!-- <div class="row main"> -->
+<h2>Grid</h2>
+<button type="button" ng-click="swap()">Swap Columns</button>
+<br>
+<br>
+<div ui-grid="gridOptions" class="grid" ui-grid-cellnav ui-grid-expandable></div>
+<!-- <div class="placeholder"> -->
+<!-- </div> -->
+
+<br>
+<br>
+
+<script>
+    var app = angular.module('test', ['ui.grid', 'ui.grid.expandable', 'ui.grid.cellNav']);
+    app.controller('Main', function($scope, $http) {
+        $scope.gridOptions = {
+            expandableRowTemplate: 'subgrid',
+            expandableRowHeight: 150,
+        };
+        $scope.gridOptions.columnDefs = [
+            { field:'id' },
+            { field:'name' },
+            { field:'age' }
+        ];
+
+        $http.get('https://rawgit.com/angular-ui/ui-grid.info/gh-pages/data/500_complex.json')
+            .success(function(data) {
+                data.forEach(function (d) {
+                    d.subGridOptions = {
+                        columnDefs: [ { field: "company" }, { field: "email" } ],
+                        data: data.slice(0, 100)
+                    };
+                });
+
+                $scope.gridOptions.data = data;
+            });
+    });
+</script>
+
+<script type="text/ng-template" id="subgrid">
+    <div ui-grid="row.entity.subGridOptions" style="height:140px;"></div>
+</script>
+
+</body>
+</html>
diff --git a/src/features/cellnav/js/cellnav.js b/src/features/cellnav/js/cellnav.js
@@ -910,12 +910,10 @@
           return {
             post: function ($scope, $elm, $attrs, controllers) {
               var uiGridCtrl = controllers[0],
-                 renderContainerCtrl = controllers[1],
-                 cellNavController = controllers[2];
+                 renderContainerCtrl = controllers[1];
 
               // Skip attaching cell-nav specific logic if the directive is not attached above us
-              if (!cellNavController) { return; }
-
+              if (!uiGridCtrl.grid.api.cellNav) { return; }
 
               var containerId = renderContainerCtrl.containerId;
 
@@ -987,14 +985,11 @@
       return {
         priority: -150, // run after default uiGridCell directive and ui.grid.edit uiGridCell
         restrict: 'A',
-        require: ['^uiGrid', '?^uiGridCellnav'],
+        require: '^uiGrid',
         scope: false,
-        link: function ($scope, $elm, $attrs, controllers) {
-          var uiGridCtrl = controllers[0],
-              cellNavController = controllers[1];
-
+        link: function ($scope, $elm, $attrs, uiGridCtrl) {
           // Skip attaching cell-nav specific logic if the directive is not attached above us
-          if (!cellNavController) { return; }
+          if (!uiGridCtrl.grid.api.cellNav) { return; }
 
           if (!$scope.col.colDef.allowCellFocus) {
             return;
