diff --git a/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/ActionDispatcher.ts b/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/ActionDispatcher.ts
new file mode 100644
index 0000000000000000000000000000000000000000..3c35d23c9c9def07fd40b7f843b05e22daa218e5
--- /dev/null
+++ b/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/ActionDispatcher.ts
@@ -0,0 +1,94 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+
+import InfoWindow = require('TYPO3/CMS/Backend/InfoWindow');
+import RegularEvent = require('TYPO3/CMS/Core/Event/RegularEvent');
+import shortcutMenu = require('TYPO3/CMS/Backend/Toolbar/ShortcutMenu');
+import documentService = require('TYPO3/CMS/Core/DocumentService');
+
+const delegates: {[key: string]: Function} = {
+  'TYPO3.InfoWindow.showItem': InfoWindow.showItem.bind(null),
+  'TYPO3.ShortcutMenu.createShortcut': shortcutMenu.createShortcut.bind(shortcutMenu),
+};
+
+/**
+ * Module: TYPO3/CMS/Backend/ActionDispatcher
+ *
+ * @example
+ * <a class="btn btn-default" href="#"
+ *  data-dispatch-action="TYPO3.InfoWindow.showItem"
+ *  data-dispatch-args-list="tt_content,123"
+ *  ...
+ *  data-dispatch-args="[$quot;tt_content&quot;,123]"
+ */
+class ActionDispatcher {
+  private static resolveArguments(element: HTMLElement): null | string[] {
+    if (element.dataset.dispatchArgs) {
+      const args = JSON.parse(element.dataset.dispatchArgs);
+      return args instanceof Array ? ActionDispatcher.trimItems(args) : null;
+    } else if (element.dataset.dispatchArgsList) {
+      const args = element.dataset.dispatchArgsList.split(',');
+      return ActionDispatcher.trimItems(args);
+    }
+    return null;
+  }
+
+  private static trimItems(items: any[]): any[] {
+    return items.map((item: any) => {
+      if (item instanceof String) {
+        return item.trim();
+      }
+      return item;
+    });
+  }
+
+  private static enrichItems(items: any[], evt: Event, target: HTMLElement): any[] {
+    return items.map((item: any) => {
+      if (!(item instanceof Object) || !item.$event) {
+        return item;
+      }
+      if (item.$target) {
+        return target;
+      }
+      if (item.$event) {
+        return evt;
+      }
+    });
+  }
+
+  public constructor() {
+    documentService.ready().then((): void => this.registerEvents());
+  }
+
+  private registerEvents(): void {
+    new RegularEvent('click', this.handleClickEvent.bind(this))
+      .delegateTo(document, '[data-dispatch-action]:not([data-dispatch-immediately])');
+    document.querySelectorAll('[data-dispatch-action][data-dispatch-immediately]')
+      .forEach(this.delegateTo.bind(this));
+  }
+
+  private handleClickEvent(evt: Event, target: HTMLElement): void {
+    evt.preventDefault();
+    this.delegateTo(target);
+  }
+
+  private delegateTo(target: HTMLElement): void {
+    const action = target.dataset.dispatchAction;
+    const args = ActionDispatcher.resolveArguments(target);
+    if (delegates[action]) {
+      delegates[action].apply(null, args || []);
+    }
+  }
+}
+
+export = new ActionDispatcher();
diff --git a/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/GlobalEventHandler.ts b/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/GlobalEventHandler.ts
index aae1d5e39f933209cc2f1d1a250b63340ee21ead..25188a5839dc2d6f9ed925ccf33e79b2d8c079b6 100644
--- a/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/GlobalEventHandler.ts
+++ b/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/GlobalEventHandler.ts
@@ -24,6 +24,8 @@ type HTMLFormChildElement = HTMLInputElement | HTMLSelectElement | HTMLTextAreaE
  *     + `<any CSS selector>` queried element is submitted (if implementing HTMLFormElement)
  *   + `data-action-navigate="..."` navigates to URL
  *     + `$value` URL taken from value of current element
+ *     + `$data` URL taken from `data-navigate-value`
+ *     + `$data=~s/$value/` URL taken from `data-navigate-value`, substituting literal `${value}`
  * + `data-global-event="click"`
  *   + @todo
  *
@@ -85,6 +87,16 @@ class GlobalEventHandler {
       return false;
     }
     const value = this.resolveHTMLFormChildElementValue(resolvedTarget);
+    const navigateValue = resolvedTarget.dataset.navigateValue;
+    if (action === '$data=~s/$value/' && value && navigateValue) {
+      // replacing `${value}` and its URL encoded representation
+      window.location.href = navigateValue.replace(/(\$\{value\}|%24%7Bvalue%7D)/gi, value);
+      return true;
+    }
+    if (action === '$data' && navigateValue) {
+      window.location.href = navigateValue;
+      return true;
+    }
     if (action === '$value' && value) {
       window.location.href = value;
       return true;
diff --git a/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/InfoWindow.ts b/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/InfoWindow.ts
index 99a0a2bf84de7c663c85d151d35b59698745e2a6..bd80ee29181481efc8e4b92c48c0fff4a28cb05a 100644
--- a/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/InfoWindow.ts
+++ b/Build/Sources/TypeScript/backend/Resources/Public/TypeScript/InfoWindow.ts
@@ -37,6 +37,10 @@ class InfoWindow {
   }
 }
 
+if (!top.TYPO3.InfoWindow) {
+  top.TYPO3.InfoWindow = InfoWindow;
+}
+
 // expose as global object
 TYPO3.InfoWindow = InfoWindow;
 export = InfoWindow;
diff --git a/Build/Sources/TypeScript/beuser/Resources/Public/TypeScript/Permissions.ts b/Build/Sources/TypeScript/beuser/Resources/Public/TypeScript/Permissions.ts
index 4a5420a3b6c8826741245701b80032603b196fcf..e81b97904950f2fdd71fe6656bb2f7194bd4a2f4 100644
--- a/Build/Sources/TypeScript/beuser/Resources/Public/TypeScript/Permissions.ts
+++ b/Build/Sources/TypeScript/beuser/Resources/Public/TypeScript/Permissions.ts
@@ -26,6 +26,7 @@ declare global {
 class Permissions {
   private options: any = {
     containerSelector: '#typo3-permissionList',
+    editControllerSelector: '#PermissionControllerEdit',
   };
 
   private ajaxUrl: string = TYPO3.settings.ajaxUrls.user_access_permissions;
@@ -235,7 +236,7 @@ class Permissions {
    * so AJAX reloads are no problem
    */
   public initializeEvents(): void {
-    // Click event to change permissions
+    // Click events to change permissions (in template Index.html)
     $(this.options.containerSelector).on('click', '.change-permission', (evt: JQueryEventObject): void => {
       evt.preventDefault();
       this.setPermissions($(evt.currentTarget));
@@ -268,6 +269,12 @@ class Permissions {
       evt.preventDefault();
       this.changeGroup($(evt.currentTarget));
     });
+    // Click events to change permissions (in template Edit.html)
+    $(this.options.editControllerSelector).on('click', '[data-check-change-permissions]', (evt: JQueryEventObject): void => {
+      const $target: JQuery = $(evt.currentTarget);
+      const args = $target.data('checkChangePermissions').split(',').map((item: string) => item.trim());
+      this.checkChange.apply(this, args);
+    });
   }
 }
 
diff --git a/typo3/sysext/backend/Classes/Template/ModuleTemplate.php b/typo3/sysext/backend/Classes/Template/ModuleTemplate.php
index 7459cb4fba203b8065b3a82ddea343cea8d4ef0a..706382ba9833de9de7e1b3e937617d54316094e9 100644
--- a/typo3/sysext/backend/Classes/Template/ModuleTemplate.php
+++ b/typo3/sysext/backend/Classes/Template/ModuleTemplate.php
@@ -256,6 +256,8 @@ class ModuleTemplate
         $this->pageRenderer->loadRequireJsModule('bootstrap');
         $this->pageRenderer->loadRequireJsModule('TYPO3/CMS/Backend/ContextHelp');
         $this->pageRenderer->loadRequireJsModule('TYPO3/CMS/Backend/DocumentHeader');
+        $this->pageRenderer->loadRequireJsModule('TYPO3/CMS/Backend/GlobalEventHandler');
+        $this->pageRenderer->loadRequireJsModule('TYPO3/CMS/Backend/ActionDispatcher');
     }
 
     /**
@@ -310,7 +312,6 @@ class ModuleTemplate
         $this->pageRenderer->enableConcatenateJavascript();
         $this->pageRenderer->enableCompressCss();
         $this->pageRenderer->enableCompressJavascript();
-        $this->pageRenderer->loadRequireJsModule('TYPO3/CMS/Backend/GlobalEventHandler');
         $languageCode = $this->pageRenderer->getLanguage() === 'default' ? 'en' : $this->pageRenderer->getLanguage();
         $this->pageRenderer->setHtmlTag('<html lang="' . htmlspecialchars($languageCode) . '">');
         if ($GLOBALS['TYPO3_CONF_VARS']['BE']['debug']) {
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/ActionDispatcher.js b/typo3/sysext/backend/Resources/Public/JavaScript/ActionDispatcher.js
new file mode 100644
index 0000000000000000000000000000000000000000..b8199599761d8b64943410beb00898d656fb5682
--- /dev/null
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/ActionDispatcher.js
@@ -0,0 +1,13 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+define(["require","exports","TYPO3/CMS/Backend/InfoWindow","TYPO3/CMS/Core/Event/RegularEvent","TYPO3/CMS/Backend/Toolbar/ShortcutMenu","TYPO3/CMS/Core/DocumentService"],(function(t,e,n,a,s,i){"use strict";const r={"TYPO3.InfoWindow.showItem":n.showItem.bind(null),"TYPO3.ShortcutMenu.createShortcut":s.createShortcut.bind(s)};class c{static resolveArguments(t){if(t.dataset.dispatchArgs){const e=JSON.parse(t.dataset.dispatchArgs);return e instanceof Array?c.trimItems(e):null}if(t.dataset.dispatchArgsList){const e=t.dataset.dispatchArgsList.split(",");return c.trimItems(e)}return null}static trimItems(t){return t.map(t=>t instanceof String?t.trim():t)}static enrichItems(t,e,n){return t.map(t=>t instanceof Object&&t.$event?t.$target?n:t.$event?e:void 0:t)}constructor(){i.ready().then(()=>this.registerEvents())}registerEvents(){new a("click",this.handleClickEvent.bind(this)).delegateTo(document,"[data-dispatch-action]:not([data-dispatch-immediately])"),document.querySelectorAll("[data-dispatch-action][data-dispatch-immediately]").forEach(this.delegateTo.bind(this))}handleClickEvent(t,e){t.preventDefault(),this.delegateTo(e)}delegateTo(t){const e=t.dataset.dispatchAction,n=c.resolveArguments(t);r[e]&&r[e].apply(null,n||[])}}return new c}));
\ No newline at end of file
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/GlobalEventHandler.js b/typo3/sysext/backend/Resources/Public/JavaScript/GlobalEventHandler.js
index 8a14ce2355d84610b98bee5657faaa01549f8c24..326c2c9de5ad0b7e164180f162d936f76124c286 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/GlobalEventHandler.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/GlobalEventHandler.js
@@ -10,4 +10,4 @@
  *
  * The TYPO3 project - inspiring people to share!
  */
-define(["require","exports","TYPO3/CMS/Core/DocumentService"],(function(e,t,n){"use strict";return new class{constructor(){this.options={onChangeSelector:'[data-global-event="change"]',onClickSelector:'[data-global-event="click"]'},n.ready().then(()=>this.registerEvents())}registerEvents(){document.querySelectorAll(this.options.onChangeSelector).forEach(e=>{document.addEventListener("change",this.handleChangeEvent.bind(this))}),document.querySelectorAll(this.options.onClickSelector).forEach(e=>{document.addEventListener("click",this.handleClickEvent.bind(this))})}handleChangeEvent(e){const t=e.target;this.handleSubmitAction(e,t)||this.handleNavigateAction(e,t)}handleClickEvent(e){e.currentTarget}handleSubmitAction(e,t){const n=t.dataset.actionSubmit;if(!n)return!1;if("$form"===n&&this.isHTMLFormChildElement(t))return t.form.submit(),!0;const i=document.querySelector(n);return i instanceof HTMLFormElement&&(i.submit(),!0)}handleNavigateAction(e,t){const n=t.dataset.actionNavigate;if(!n)return!1;const i=this.resolveHTMLFormChildElementValue(t);return!("$value"!==n||!i)&&(window.location.href=i,!0)}isHTMLFormChildElement(e){return e instanceof HTMLSelectElement||e instanceof HTMLInputElement||e instanceof HTMLTextAreaElement}resolveHTMLFormChildElementValue(e){return e instanceof HTMLSelectElement?e.options[e.selectedIndex].value:e instanceof HTMLInputElement?e.value:null}}}));
\ No newline at end of file
+define(["require","exports","TYPO3/CMS/Core/DocumentService"],(function(e,t,n){"use strict";return new class{constructor(){this.options={onChangeSelector:'[data-global-event="change"]',onClickSelector:'[data-global-event="click"]'},n.ready().then(()=>this.registerEvents())}registerEvents(){document.querySelectorAll(this.options.onChangeSelector).forEach(e=>{document.addEventListener("change",this.handleChangeEvent.bind(this))}),document.querySelectorAll(this.options.onClickSelector).forEach(e=>{document.addEventListener("click",this.handleClickEvent.bind(this))})}handleChangeEvent(e){const t=e.target;this.handleSubmitAction(e,t)||this.handleNavigateAction(e,t)}handleClickEvent(e){e.currentTarget}handleSubmitAction(e,t){const n=t.dataset.actionSubmit;if(!n)return!1;if("$form"===n&&this.isHTMLFormChildElement(t))return t.form.submit(),!0;const i=document.querySelector(n);return i instanceof HTMLFormElement&&(i.submit(),!0)}handleNavigateAction(e,t){const n=t.dataset.actionNavigate;if(!n)return!1;const i=this.resolveHTMLFormChildElementValue(t),o=t.dataset.navigateValue;return"$data=~s/$value/"===n&&i&&o?(window.location.href=o.replace(/(\$\{value\}|%24%7Bvalue%7D)/gi,i),!0):"$data"===n&&o?(window.location.href=o,!0):!("$value"!==n||!i)&&(window.location.href=i,!0)}isHTMLFormChildElement(e){return e instanceof HTMLSelectElement||e instanceof HTMLInputElement||e instanceof HTMLTextAreaElement}resolveHTMLFormChildElementValue(e){return e instanceof HTMLSelectElement?e.options[e.selectedIndex].value:e instanceof HTMLInputElement?e.value:null}}}));
\ No newline at end of file
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/InfoWindow.js b/typo3/sysext/backend/Resources/Public/JavaScript/InfoWindow.js
index 9281d81a6f3184776e79e9efcd4b9f4f02604582..b8fce3ae76883c0290a15d2d8d35d52fad91fbb3 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/InfoWindow.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/InfoWindow.js
@@ -10,4 +10,4 @@
  *
  * The TYPO3 project - inspiring people to share!
  */
-define(["require","exports","./Enum/Severity","./Modal"],(function(e,t,n,o){"use strict";class i{static showItem(e,t){o.advanced({type:o.types.iframe,size:o.sizes.large,content:top.TYPO3.settings.ShowItem.moduleUrl+"&table="+encodeURIComponent(e)+"&uid="+("number"==typeof t?t:encodeURIComponent(t)),severity:n.SeverityEnum.notice})}}return TYPO3.InfoWindow=i,i}));
\ No newline at end of file
+define(["require","exports","./Enum/Severity","./Modal"],(function(e,t,n,o){"use strict";class i{static showItem(e,t){o.advanced({type:o.types.iframe,size:o.sizes.large,content:top.TYPO3.settings.ShowItem.moduleUrl+"&table="+encodeURIComponent(e)+"&uid="+("number"==typeof t?t:encodeURIComponent(t)),severity:n.SeverityEnum.notice})}}return top.TYPO3.InfoWindow||(top.TYPO3.InfoWindow=i),TYPO3.InfoWindow=i,i}));
\ No newline at end of file
diff --git a/typo3/sysext/beuser/Classes/Controller/PermissionController.php b/typo3/sysext/beuser/Classes/Controller/PermissionController.php
index 6b3b8824fc06fce9eafa7af61089a8b3a00d6e8f..ac616e436347de625ff2d7bdceb8097c6ca507a2 100644
--- a/typo3/sysext/beuser/Classes/Controller/PermissionController.php
+++ b/typo3/sysext/beuser/Classes/Controller/PermissionController.php
@@ -209,7 +209,7 @@ class PermissionController extends ActionController
         $depthOptions = [];
         $url = $this->uriBuilder->reset()->setArguments([
             'action' => 'index',
-            'depth' => '__DEPTH__',
+            'depth' => '${value}',
             'id' => $this->id
         ])->buildBackendUri();
         foreach ([1, 2, 3, 4, 10] as $depthLevel) {
diff --git a/typo3/sysext/beuser/Resources/Private/Layouts/Default.html b/typo3/sysext/beuser/Resources/Private/Layouts/Default.html
index 0552a8b365ffb46431bedc7c5fc33dfa2f08eea5..8f848c7092f24ad0393a6a819fae704d6677b2b0 100644
--- a/typo3/sysext/beuser/Resources/Private/Layouts/Default.html
+++ b/typo3/sysext/beuser/Resources/Private/Layouts/Default.html
@@ -24,7 +24,9 @@
     <f:render section="Buttons" />
     <be:moduleLayout.button.shortcutButton displayName="{f:translate(id: shortcutLabel)}" />
 
-    <f:render section="Content" />
+    <div id="beuser-main-content">
+        <f:render section="Content" />
+    </div>
 
 </be:moduleLayout>
 
diff --git a/typo3/sysext/beuser/Resources/Private/Partials/BackendUser/IndexListRow.html b/typo3/sysext/beuser/Resources/Private/Partials/BackendUser/IndexListRow.html
index 28505cadcb845ba20bd3063f9cad428b4a9696c7..0dbaf38205ad81d0573f45f61907bf34c7648f86 100644
--- a/typo3/sysext/beuser/Resources/Private/Partials/BackendUser/IndexListRow.html
+++ b/typo3/sysext/beuser/Resources/Private/Partials/BackendUser/IndexListRow.html
@@ -89,7 +89,9 @@
             <f:link.action action="show" arguments="{uid: backendUser.uid}" class="btn btn-default" title="{f:translate(key: 'details')}">
                 <core:icon identifier="actions-system-options-view" size="small"/>
             </f:link.action>
-            <a class="btn btn-default" href="#" title="{f:translate(key:'info')}" onclick="top.TYPO3.InfoWindow.showItem('be_users', '{backendUser.uid}'); return false;"><core:icon identifier="actions-document-info" /></a>
+            <a class="btn btn-default" href="#" title="{f:translate(key:'info')}" data-dispatch-action="TYPO3.InfoWindow.showItem" data-dispatch-args-list="be_users,{backendUser.uid}">
+                <core:icon identifier="actions-document-info" />
+            </a>
         </div>
         <div class="btn-group" role="group">
             <f:if condition="{compareUserUidList.{backendUser.uid}}">
diff --git a/typo3/sysext/beuser/Resources/Private/Partials/BackendUser/OnlineListRow.html b/typo3/sysext/beuser/Resources/Private/Partials/BackendUser/OnlineListRow.html
index 07bc06cf8a8cd52d86c61ab0fe8bafb0095a4ccc..01d52640985764aa0fb98c466d0d7c9dcff3e11c 100644
--- a/typo3/sysext/beuser/Resources/Private/Partials/BackendUser/OnlineListRow.html
+++ b/typo3/sysext/beuser/Resources/Private/Partials/BackendUser/OnlineListRow.html
@@ -40,7 +40,7 @@
                         </f:link.action>
                     </f:else>
                 </f:if>
-                <a class="btn btn-default" href="#" onclick="top.TYPO3.InfoWindow.showItem('be_users', '{onlineUser.backendUser.uid}'); return false;">
+                <a class="btn btn-default" href="#" data-dispatch-action="TYPO3.InfoWindow.showItem" data-dispatch-args-list="be_users,{onlineUser.backendUser.uid}">
                     <core:icon identifier="actions-document-info" />
                 </a>
             </div>
diff --git a/typo3/sysext/beuser/Resources/Private/Partials/BackendUserGroup/IndexListRow.html b/typo3/sysext/beuser/Resources/Private/Partials/BackendUserGroup/IndexListRow.html
index 78621a0a630969e2688f5d187e723e0ef5d4e1d7..c76d399d18450d543f77ea2acfb543a4d6ba467d 100644
--- a/typo3/sysext/beuser/Resources/Private/Partials/BackendUserGroup/IndexListRow.html
+++ b/typo3/sysext/beuser/Resources/Private/Partials/BackendUserGroup/IndexListRow.html
@@ -39,7 +39,9 @@
             </f:if>
         </div>
         <div class="btn-group" role="group">
-            <a class="btn btn-default" href="#" onclick="top.TYPO3.InfoWindow.showItem('be_groups', '{backendUserGroup.uid}'); return false;"><core:icon identifier="actions-document-info" /></a>
+            <a class="btn btn-default" href="#" data-dispatch-action="TYPO3.InfoWindow.showItem" data-dispatch-args-list="be_groups,{backendUserGroup.uid}">
+                <core:icon identifier="actions-document-info" />
+            </a>
         </div>
         <div class="btn-group" role="group">
             <f:if condition="{compareGroupUidList.{backendUserGroup.uid}}">
diff --git a/typo3/sysext/beuser/Resources/Private/Templates/Permission/Edit.html b/typo3/sysext/beuser/Resources/Private/Templates/Permission/Edit.html
index 265b3d4cae586a60b6dce2f3d06d4390b5f314b6..de1098426d8eb33f636735b1430e63cc5405cf0e 100644
--- a/typo3/sysext/beuser/Resources/Private/Templates/Permission/Edit.html
+++ b/typo3/sysext/beuser/Resources/Private/Templates/Permission/Edit.html
@@ -45,27 +45,27 @@
                     <tbody>
                         <tr>
                             <td><strong><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:Owner" /></strong></td>
-                            <td><input type="checkbox" name="check[perms_user][1]" onclick="TYPO3.Permissions.checkChange('check[perms_user]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_user]')" /></td>
-                            <td><input type="checkbox" name="check[perms_user][5]" onclick="TYPO3.Permissions.checkChange('check[perms_user]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_user]')" /></td>
-                            <td><input type="checkbox" name="check[perms_user][2]" onclick="TYPO3.Permissions.checkChange('check[perms_user]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_user]')" /></td>
-                            <td><input type="checkbox" name="check[perms_user][3]" onclick="TYPO3.Permissions.checkChange('check[perms_user]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_user]')" /></td>
-                            <td><input type="checkbox" name="check[perms_user][4]" onclick="TYPO3.Permissions.checkChange('check[perms_user]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_user]')" /></td>
+                            <td><input type="checkbox" name="check[perms_user][1]" data-check-change-permissions="check[perms_user],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_user]" /></td>
+                            <td><input type="checkbox" name="check[perms_user][5]" data-check-change-permissions="check[perms_user],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_user]" /></td>
+                            <td><input type="checkbox" name="check[perms_user][2]" data-check-change-permissions="check[perms_user],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_user]" /></td>
+                            <td><input type="checkbox" name="check[perms_user][3]" data-check-change-permissions="check[perms_user],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_user]" /></td>
+                            <td><input type="checkbox" name="check[perms_user][4]" data-check-change-permissions="check[perms_user],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_user]" /></td>
                         </tr>
                         <tr>
                             <td><strong><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:Group" /></strong></td>
-                            <td><input type="checkbox" name="check[perms_group][1]" onclick="TYPO3.Permissions.checkChange('check[perms_group]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_group]')" /></td>
-                            <td><input type="checkbox" name="check[perms_group][5]" onclick="TYPO3.Permissions.checkChange('check[perms_group]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_group]')" /></td>
-                            <td><input type="checkbox" name="check[perms_group][2]" onclick="TYPO3.Permissions.checkChange('check[perms_group]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_group]')" /></td>
-                            <td><input type="checkbox" name="check[perms_group][3]" onclick="TYPO3.Permissions.checkChange('check[perms_group]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_group]')" /></td>
-                            <td><input type="checkbox" name="check[perms_group][4]" onclick="TYPO3.Permissions.checkChange('check[perms_group]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_group]')" /></td>
+                            <td><input type="checkbox" name="check[perms_group][1]" data-check-change-permissions="check[perms_group],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_group]" /></td>
+                            <td><input type="checkbox" name="check[perms_group][5]" data-check-change-permissions="check[perms_group],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_group]" /></td>
+                            <td><input type="checkbox" name="check[perms_group][2]" data-check-change-permissions="check[perms_group],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_group]" /></td>
+                            <td><input type="checkbox" name="check[perms_group][3]" data-check-change-permissions="check[perms_group],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_group]" /></td>
+                            <td><input type="checkbox" name="check[perms_group][4]" data-check-change-permissions="check[perms_group],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_group]" /></td>
                         </tr>
                         <tr>
                             <td><strong><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:Everybody" /></strong></td>
-                            <td><input type="checkbox" name="check[perms_everybody][1]" onclick="TYPO3.Permissions.checkChange('check[perms_everybody]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_everybody]')" /></td>
-                            <td><input type="checkbox" name="check[perms_everybody][5]" onclick="TYPO3.Permissions.checkChange('check[perms_everybody]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_everybody]')" /></td>
-                            <td><input type="checkbox" name="check[perms_everybody][2]" onclick="TYPO3.Permissions.checkChange('check[perms_everybody]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_everybody]')" /></td>
-                            <td><input type="checkbox" name="check[perms_everybody][3]" onclick="TYPO3.Permissions.checkChange('check[perms_everybody]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_everybody]')" /></td>
-                            <td><input type="checkbox" name="check[perms_everybody][4]" onclick="TYPO3.Permissions.checkChange('check[perms_everybody]', 'tx_beuser_system_beusertxpermission[data][pages][{id}][perms_everybody]')" /></td>
+                            <td><input type="checkbox" name="check[perms_everybody][1]" data-check-change-permissions="check[perms_everybody],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_everybody]" /></td>
+                            <td><input type="checkbox" name="check[perms_everybody][5]" data-check-change-permissions="check[perms_everybody],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_everybody]" /></td>
+                            <td><input type="checkbox" name="check[perms_everybody][2]" data-check-change-permissions="check[perms_everybody],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_everybody]" /></td>
+                            <td><input type="checkbox" name="check[perms_everybody][3]" data-check-change-permissions="check[perms_everybody],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_everybody]" /></td>
+                            <td><input type="checkbox" name="check[perms_everybody][4]" data-check-change-permissions="check[perms_everybody],tx_beuser_system_beusertxpermission[data][pages][{id}][perms_everybody]" /></td>
                         </tr>
                     </tbody>
                 </table>
diff --git a/typo3/sysext/beuser/Resources/Private/Templates/Permission/Index.html b/typo3/sysext/beuser/Resources/Private/Templates/Permission/Index.html
index 397cde263ca0fa49c1964920ab92e7d2d69413aa..bb20195be1760c0c0adb3b59f2e86daa08429306 100644
--- a/typo3/sysext/beuser/Resources/Private/Templates/Permission/Index.html
+++ b/typo3/sysext/beuser/Resources/Private/Templates/Permission/Index.html
@@ -8,10 +8,10 @@
 </f:section>
 
 <f:section name="content">
-
     <div class="form-group">
         <label for="depth"><f:translate key="LLL:EXT:beuser/Resources/Private/Language/locallang_mod_permission.xlf:Depth" />:</label>
-        <f:form.select class="form-control" id="depth" value="{depth}" options="{depthOptions}" additionalAttributes="{onchange: 'window.location.href = \'{depthBaseUrl}\'.replace(\'__DEPTH__\', this.options[this.selectedIndex].value);'}" />
+        <f:form.select class="form-control" id="depth" value="{depth}" options="{depthOptions}"
+                        additionalAttributes="{data-global-event: 'change', data-action-navigate: '$data=~s/$value/', data-navigate-value:depthBaseUrl}" />
     </div>
 
     <div class="panel panel-default panel-space">
diff --git a/typo3/sysext/beuser/Resources/Public/JavaScript/Permissions.js b/typo3/sysext/beuser/Resources/Public/JavaScript/Permissions.js
index 1bfca95be02d3da582bba5f05a869d0362168838..021a625f3b69a589a85eaf6e950b403dbaeb6c77 100644
--- a/typo3/sysext/beuser/Resources/Public/JavaScript/Permissions.js
+++ b/typo3/sysext/beuser/Resources/Public/JavaScript/Permissions.js
@@ -10,4 +10,4 @@
  *
  * The TYPO3 project - inspiring people to share!
  */
-define(["require","exports","jquery","TYPO3/CMS/Core/Ajax/AjaxRequest"],(function(e,t,a,r){"use strict";let o=new class{constructor(){this.options={containerSelector:"#typo3-permissionList"},this.ajaxUrl=TYPO3.settings.ajaxUrls.user_access_permissions,this.initializeEvents()}setCheck(e,t){if(document.editform[t]){let a=document.editform[t].value;for(let t=1;t<=5;t++)document.editform[e+"["+t+"]"].checked=a&Math.pow(2,t-1)}}checkChange(e,t){let a=0;for(let t=1;t<=5;t++)document.editform[e+"["+t+"]"].checked&&(a|=Math.pow(2,t-1));document.editform[t].value=a|("tx_beuser_system_beusertxpermission[check][perms_user]"===e?1:0),this.setCheck(e,t)}setPermissions(e){let t=e.data("page"),o=e.data("who"),n="#"+t+"_"+o;new r(this.ajaxUrl).post({page:t,who:o,permissions:e.data("permissions"),mode:e.data("mode"),bits:e.data("bits")}).then(async e=>{const t=await e.resolve();a(n).replaceWith(t),a(n).find("button").tooltip()})}toggleEditLock(e){let t=e.data("page");new r(this.ajaxUrl).post({action:"toggle_edit_lock",page:t,editLockState:e.data("lockstate")}).then(async e=>{a("#el_"+t).replaceWith(await e.resolve())})}changeOwner(e){let t=e.data("page");new r(this.ajaxUrl).post({action:"change_owner",page:t,ownerUid:e.data("owner"),newOwnerUid:a("#new_page_owner").val()}).then(async e=>{a("#o_"+t).replaceWith(await e.resolve())})}showChangeOwnerSelector(e){let t=e.data("page");new r(this.ajaxUrl).post({action:"show_change_owner_selector",page:t,ownerUid:e.data("owner"),username:e.data("username")}).then(async e=>{a("#o_"+t).replaceWith(await e.resolve())})}restoreOwner(e){let t=e.data("page"),r=e.data("username"),o=r;void 0===r&&(r=a("<span>",{class:"not_set",text:"[not set]"}),o=r.html(),r=r.text());let n=a("<span/>",{id:"o_"+t}),s=a("<a/>",{class:"ug_selector changeowner","data-page":t,"data-owner":e.data("owner"),"data-username":o,text:r});n.append(s),a("#o_"+t).replaceWith(n)}changeGroup(e){let t=e.data("page");new r(this.ajaxUrl).post({action:"change_group",page:t,groupUid:e.data("groupId"),newGroupUid:a("#new_page_group").val()}).then(async e=>{a("#g_"+t).replaceWith(await e.resolve())})}showChangeGroupSelector(e){let t=e.data("page");new r(this.ajaxUrl).post({action:"show_change_group_selector",page:t,groupUid:e.data("groupId"),groupname:e.data("groupname")}).then(async e=>{a("#g_"+t).replaceWith(await e.resolve())})}restoreGroup(e){let t=e.data("page"),r=e.data("groupname"),o=r;void 0===r&&(r=a("<span>",{class:"not_set",text:"[not set]"}),o=r.html(),r=r.text());let n=a("<span/>",{id:"g_"+t}),s=a("<a/>",{class:"ug_selector changegroup","data-page":t,"data-group":e.data("groupId"),"data-groupname":o,text:r});n.append(s),a("#g_"+t).replaceWith(n)}initializeEvents(){a(this.options.containerSelector).on("click",".change-permission",e=>{e.preventDefault(),this.setPermissions(a(e.currentTarget))}).on("click",".editlock",e=>{e.preventDefault(),this.toggleEditLock(a(e.currentTarget))}).on("click",".changeowner",e=>{e.preventDefault(),this.showChangeOwnerSelector(a(e.currentTarget))}).on("click",".changegroup",e=>{e.preventDefault(),this.showChangeGroupSelector(a(e.currentTarget))}).on("click",".restoreowner",e=>{e.preventDefault(),this.restoreOwner(a(e.currentTarget))}).on("click",".saveowner",e=>{e.preventDefault(),this.changeOwner(a(e.currentTarget))}).on("click",".restoregroup",e=>{e.preventDefault(),this.restoreGroup(a(e.currentTarget))}).on("click",".savegroup",e=>{e.preventDefault(),this.changeGroup(a(e.currentTarget))})}};return TYPO3.Permissions=o,o}));
\ No newline at end of file
+define(["require","exports","jquery","TYPO3/CMS/Core/Ajax/AjaxRequest"],(function(e,t,a,r){"use strict";let o=new class{constructor(){this.options={containerSelector:"#typo3-permissionList",editControllerSelector:"#PermissionControllerEdit"},this.ajaxUrl=TYPO3.settings.ajaxUrls.user_access_permissions,this.initializeEvents()}setCheck(e,t){if(document.editform[t]){let a=document.editform[t].value;for(let t=1;t<=5;t++)document.editform[e+"["+t+"]"].checked=a&Math.pow(2,t-1)}}checkChange(e,t){let a=0;for(let t=1;t<=5;t++)document.editform[e+"["+t+"]"].checked&&(a|=Math.pow(2,t-1));document.editform[t].value=a|("tx_beuser_system_beusertxpermission[check][perms_user]"===e?1:0),this.setCheck(e,t)}setPermissions(e){let t=e.data("page"),o=e.data("who"),n="#"+t+"_"+o;new r(this.ajaxUrl).post({page:t,who:o,permissions:e.data("permissions"),mode:e.data("mode"),bits:e.data("bits")}).then(async e=>{const t=await e.resolve();a(n).replaceWith(t),a(n).find("button").tooltip()})}toggleEditLock(e){let t=e.data("page");new r(this.ajaxUrl).post({action:"toggle_edit_lock",page:t,editLockState:e.data("lockstate")}).then(async e=>{a("#el_"+t).replaceWith(await e.resolve())})}changeOwner(e){let t=e.data("page");new r(this.ajaxUrl).post({action:"change_owner",page:t,ownerUid:e.data("owner"),newOwnerUid:a("#new_page_owner").val()}).then(async e=>{a("#o_"+t).replaceWith(await e.resolve())})}showChangeOwnerSelector(e){let t=e.data("page");new r(this.ajaxUrl).post({action:"show_change_owner_selector",page:t,ownerUid:e.data("owner"),username:e.data("username")}).then(async e=>{a("#o_"+t).replaceWith(await e.resolve())})}restoreOwner(e){let t=e.data("page"),r=e.data("username"),o=r;void 0===r&&(r=a("<span>",{class:"not_set",text:"[not set]"}),o=r.html(),r=r.text());let n=a("<span/>",{id:"o_"+t}),s=a("<a/>",{class:"ug_selector changeowner","data-page":t,"data-owner":e.data("owner"),"data-username":o,text:r});n.append(s),a("#o_"+t).replaceWith(n)}changeGroup(e){let t=e.data("page");new r(this.ajaxUrl).post({action:"change_group",page:t,groupUid:e.data("groupId"),newGroupUid:a("#new_page_group").val()}).then(async e=>{a("#g_"+t).replaceWith(await e.resolve())})}showChangeGroupSelector(e){let t=e.data("page");new r(this.ajaxUrl).post({action:"show_change_group_selector",page:t,groupUid:e.data("groupId"),groupname:e.data("groupname")}).then(async e=>{a("#g_"+t).replaceWith(await e.resolve())})}restoreGroup(e){let t=e.data("page"),r=e.data("groupname"),o=r;void 0===r&&(r=a("<span>",{class:"not_set",text:"[not set]"}),o=r.html(),r=r.text());let n=a("<span/>",{id:"g_"+t}),s=a("<a/>",{class:"ug_selector changegroup","data-page":t,"data-group":e.data("groupId"),"data-groupname":o,text:r});n.append(s),a("#g_"+t).replaceWith(n)}initializeEvents(){a(this.options.containerSelector).on("click",".change-permission",e=>{e.preventDefault(),this.setPermissions(a(e.currentTarget))}).on("click",".editlock",e=>{e.preventDefault(),this.toggleEditLock(a(e.currentTarget))}).on("click",".changeowner",e=>{e.preventDefault(),this.showChangeOwnerSelector(a(e.currentTarget))}).on("click",".changegroup",e=>{e.preventDefault(),this.showChangeGroupSelector(a(e.currentTarget))}).on("click",".restoreowner",e=>{e.preventDefault(),this.restoreOwner(a(e.currentTarget))}).on("click",".saveowner",e=>{e.preventDefault(),this.changeOwner(a(e.currentTarget))}).on("click",".restoregroup",e=>{e.preventDefault(),this.restoreGroup(a(e.currentTarget))}).on("click",".savegroup",e=>{e.preventDefault(),this.changeGroup(a(e.currentTarget))}),a(this.options.editControllerSelector).on("click","[data-check-change-permissions]",e=>{const t=a(e.currentTarget).data("checkChangePermissions").split(",").map(e=>e.trim());this.checkChange.apply(this,t)})}};return TYPO3.Permissions=o,o}));
\ No newline at end of file