diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbuttongroup.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbuttongroup.directive.js
index aff67a93c9..292f0cc786 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbuttongroup.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/buttons/umbbuttongroup.directive.js
@@ -9,13 +9,13 @@ Use this directive to render a button with a dropdown of alternative actions.
 
 <h3>Markup example</h3>
 <pre>
-    <div ng-controller="Umbraco.Controller as vm">
+    <div ng-controller="My.Controller as vm">
 
         <umb-button-group
            ng-if="vm.buttonGroup"
            default-button="vm.buttonGroup.defaultButton"
            sub-buttons="vm.buttonGroup.subButtons"
-           direction="up"
+           direction="down"
            float="right">
         </umb-button-group>
 
@@ -30,10 +30,12 @@ Use this directive to render a button with a dropdown of alternative actions.
         function Controller() {
 
             var vm = this;
+
             vm.buttonGroup = {
                 defaultButton: {
                     labelKey: "general_defaultButton",
                     hotKey: "ctrl+d",
+                    hotKeyWhenHidden: true,
                     handler: function() {
                         // do magic here
                     }
@@ -42,15 +44,16 @@ Use this directive to render a button with a dropdown of alternative actions.
                     {
                         labelKey: "general_subButton",
                         hotKey: "ctrl+b",
+                        hotKeyWhenHidden: true,
                         handler: function() {
                             // do magic here
                         }
                     }
                 ]
-            }
+            };
         }
 
-        angular.module("umbraco").controller("Umbraco.Controller", Controller);
+        angular.module("umbraco").controller("My.Controller", Controller);
 
     })();
 </pre>
@@ -67,6 +70,11 @@ Use this directive to render a button with a dropdown of alternative actions.
         <small>(array)</small> -
         Set a keyboard shortcut for the button ("ctrl+c").
     </li>
+    <li>
+        <strong>hotKeyWhenHidden</strong>
+        <small>(boolean)</small> -
+        As a default the hotkeys only works on elements visible in the UI. Set to <code>true</code> to set a hotkey on the hidden sub buttons.
+    </li>
     <li>
         <strong>handler</strong>
         <small>(callback)</small> -
@@ -76,9 +84,9 @@ Use this directive to render a button with a dropdown of alternative actions.
 
 @param {object} defaultButton The model of the default button.
 @param {array} subButtons Array of sub buttons.
-@param {string=} state Set a progress state on the button (init, busy, success, error).
-@param {string=} direction Set the direction of the dropdown (up, down).
-@param {string=} float Set the float of the dropdown. (left, right).
+@param {string=} state Set a progress state on the button ("init", "busy", "success", "error").
+@param {string=} direction Set the direction of the dropdown ("up", "down").
+@param {string=} float Set the float of the dropdown. ("left", "right").
 **/
 
 (function() {