diff --git a/src/events/eventModal.js b/src/events/eventModal.js
new file mode 100644
index 0000000000000000000000000000000000000000..057151ec8328677b4929ba437f33a0173b09f669
--- /dev/null
+++ b/src/events/eventModal.js
@@ -0,0 +1,16 @@
+import m from 'mithril';
+import viewEvent from './viewEvent';
+import newEvent from './newEvent';
+
+export default class EventModal {
+  constructor() {
+    this.edit = false;
+  }
+
+  view() {
+    if (this.edit) {
+      return m(newEvent);
+    }
+    return m(viewEvent, { onEdit: () => { this.edit = true; } });
+  }
+}
diff --git a/src/events/viewEvent.js b/src/events/viewEvent.js
index 955c9847611744ad0a92e6b25a54112b30d39077..f782c9cd2a4c758b68c7826437b81e5a83f852df 100644
--- a/src/events/viewEvent.js
+++ b/src/events/viewEvent.js
@@ -178,7 +178,7 @@ export default class viewEvent extends ItemView {
     }
   }
 
-    view() {
+    view({ attrs: { onEdit } }) {
         if (!this.data) return '';
         console.log(Object.keys(this));
         console.log(this['data']);
@@ -280,7 +280,11 @@ export default class viewEvent extends ItemView {
         return m("div", {
             style: { height: '100%', 'overflow-y': 'scroll', padding: '10px'}
             },[
-            m(Button, {element: 'div', label: "Update Event"}),
+            m(Button, {
+              element: 'div',
+              label: 'Update Event',
+              events: { onclick: onEdit },
+            }),
             m("h1", {style: { 'margin-top': '0px', 'margin-bottom': '0px' } }, [this.data.title_de]),
             m('div', { style: { float: 'left', 'margin-right': '20px'} }, [
                 this.data.time_start ? m('div', m('span.propertyTitle', `Time`)) : '',
diff --git a/src/index.js b/src/index.js
index 4d9ef91d294ec4e30f2b4e9b2d9bcc33228ff3dc..75ea31cb6a7311ed13668df0e5d908650239d367 100644
--- a/src/index.js
+++ b/src/index.js
@@ -5,7 +5,7 @@ import { UserModal, UserTable, NewUser } from './userTool';
 import { MembershipView } from './membershipTool';
 import EventTable from './events/table';
 import newEvent from './events/newEvent';
-import viewEvent from './events/viewEvent';
+import EventModal from './events/eventModal';
 import eventDraft from './events/eventDraft';
 import eventWithExport from './events/eventWithExport';
 import Layout from './layout';
@@ -28,7 +28,7 @@ m.route(root, '/users', {
   '/newuser': layoutWith(NewUser),
   '/groupmemberships/:id': layoutWith(MembershipView),
   '/events': layoutWith(EventTable),
-  '/events/:id': layoutWith(viewEvent),
+  '/events/:id': layoutWith(EventModal),
   '/newevent': layoutWith(newEvent),
   '/draftevent': layoutWith(eventDraft),
   '/eventwithexport': layoutWith(eventWithExport),