diff --git a/UI/Templates/SchedulerUI/UIxAppointmentViewTemplate.wox b/UI/Templates/SchedulerUI/UIxAppointmentViewTemplate.wox
index fd1afd873..8a089baeb 100644
--- a/UI/Templates/SchedulerUI/UIxAppointmentViewTemplate.wox
+++ b/UI/Templates/SchedulerUI/UIxAppointmentViewTemplate.wox
@@ -5,24 +5,50 @@
     xmlns:const="http://www.skyrix.com/od/constant"
     xmlns:label="OGo:label">
   <md-dialog flex="40" flex-md="80" flex-sm="100">
-      <md-toolbar ng-class="editor.component.getClassName('bg')">
-        <div class="md-toolbar-tools">
-          <md-icon class="material-icons sg-icon-toolbar-bg">event</md-icon>
-          <div class="sg-md-title md-flex">
-            <!-- classification -->
-            <md-icon ng-if="editor.component.classification == 'confidential'">visibility_off</md-icon>
-            <md-icon ng-if="editor.component.classification == 'private'">vpn_key</md-icon>
-            <!-- summary -->
-            {{::editor.component.summary}}
-            <!-- priority -->
-            <md-icon ng-repeat="i in ::editor.component.priority | range">star</md-icon>
-          </div>
-          <md-button class="md-icon-button" ng-click="editor.close()">
-            <md-icon aria-label="Close dialog">close</md-icon>
-          </md-button>
+    <md-toolbar ng-class="editor.component.getClassName('bg')">
+      <div class="md-toolbar-tools">
+        <md-icon class="material-icons sg-icon-toolbar-bg">event</md-icon>
+        <div class="sg-md-title md-flex">
+          <!-- classification -->
+          <md-icon ng-if="editor.component.classification == 'confidential'">visibility_off</md-icon>
+          <md-icon ng-if="editor.component.classification == 'private'">vpn_key</md-icon>
+          <!-- summary -->
+          {{::editor.component.summary}}
+          <!-- priority -->
+          <md-icon ng-repeat="i in ::editor.component.priority | range">star</md-icon>
         </div>
-      </md-toolbar>
-      <md-dialog-content>
+        <md-button class="md-icon-button"
+                   label:aria-label="Delete Event"
+                   ng-show="editor.component.isEditable() || editor.component.isInvitation()"
+                   ng-click="editor.deleteAllOccurrences()">
+          <md-icon>delete</md-icon>
+        </md-button>
+        <md-menu ng-show="editor.component.isEditableOccurrence() || editor.component.isInvitationOccurrence()">
+          <md-button type="button" class="md-icon-button"
+                     label:aria-label="Delete Event"
+                     ng-click="$mdOpenMenu()"
+                     md-menu-origin="md-menu-origin"><md-icon>delete</md-icon></md-button>
+          <md-menu-content>
+            <md-menu-item>
+              <md-button type="button" class="md-warn"
+                         ng-click="editor.deleteOccurrence()">
+                <var:string label:value="Delete This Occurrence"/>
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button type="button" class="md-warn"
+                         ng-click="editor.deleteAllOccurrences()">
+                <var:string label:value="Delete All Occurrences"/>
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+        <md-button class="md-icon-button" ng-click="editor.close()">
+          <md-icon label:aria-label="Close">close</md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
       <md-list>
         <!-- categories -->
         <md-list-item ng-show="editor.component.categories.length > 0">
diff --git a/UI/Templates/SchedulerUI/UIxTaskViewTemplate.wox b/UI/Templates/SchedulerUI/UIxTaskViewTemplate.wox
index 7826cb58d..3e69ea42a 100644
--- a/UI/Templates/SchedulerUI/UIxTaskViewTemplate.wox
+++ b/UI/Templates/SchedulerUI/UIxTaskViewTemplate.wox
@@ -17,8 +17,34 @@
           <!-- priority -->
           <md-icon ng-repeat="i in editor.component.priority | range">star</md-icon>
         </div>
+        <md-button class="md-icon-button"
+                   label:aria-label="Delete Task"
+                   ng-show="editor.component.isEditable() || editor.component.isInvitation()"
+                   ng-click="editor.deleteAllOccurrences()">
+          <md-icon>delete</md-icon>
+        </md-button>
+        <md-menu ng-show="editor.component.isEditableOccurrence() || editor.component.isInvitationOccurrence()">
+          <md-button type="button" class="md-icon-button"
+                     label:aria-label="Delete Task"
+                     ng-click="$mdOpenMenu()"
+                     md-menu-origin="md-menu-origin"><md-icon>delete</md-icon></md-button>
+          <md-menu-content>
+            <md-menu-item>
+              <md-button type="button" class="md-warn"
+                         ng-click="editor.deleteOccurrence()">
+                <var:string label:value="Delete This Occurrence"/>
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button type="button" class="md-warn"
+                         ng-click="editor.deleteAllOccurrences()">
+                <var:string label:value="Delete All Occurrences"/>
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
         <md-button class="md-icon-button" ng-click="editor.close()">
-          <md-icon aria-label="Close dialog">close</md-icon>
+          <md-icon label:aria-label="Close">close</md-icon>
         </md-button>
       </div>
     </md-toolbar>
diff --git a/UI/WebServerResources/js/Scheduler/Component.service.js b/UI/WebServerResources/js/Scheduler/Component.service.js
index ce89c8233..87d694faa 100644
--- a/UI/WebServerResources/js/Scheduler/Component.service.js
+++ b/UI/WebServerResources/js/Scheduler/Component.service.js
@@ -872,6 +872,21 @@
       });
   };
 
+  /**
+   * @function $delete
+   * @memberof Component.prototype
+   * @desc Delete the component from the server.
+   * @param {boolean} occurrenceOnly - delete this occurrence only
+   */
+  Component.prototype.remove = function(occurrenceOnly) {
+    var _this = this, path = [this.pid, this.id];
+
+    if (occurrenceOnly && this.occurrenceId)
+      path.push(this.occurrenceId);
+
+    return Component.$$resource.remove(path.join('/'));
+  };
+
   /**
    * @function $unwrap
    * @memberof Component.prototype
diff --git a/UI/WebServerResources/js/Scheduler/ComponentController.js b/UI/WebServerResources/js/Scheduler/ComponentController.js
index 7ab0db0e9..784bf073b 100644
--- a/UI/WebServerResources/js/Scheduler/ComponentController.js
+++ b/UI/WebServerResources/js/Scheduler/ComponentController.js
@@ -17,6 +17,8 @@
     vm.editAllOccurrences = editAllOccurrences;
     vm.reply = reply;
     vm.replyAllOccurrences = replyAllOccurrences;
+    vm.deleteOccurrence = deleteOccurrence;
+    vm.deleteAllOccurrences = deleteAllOccurrences;
 
     // Load all attributes of component
     if (angular.isUndefined(vm.component.$futureComponentData)) {
@@ -88,7 +90,21 @@
         reply(component);
       });
     }
-  }
+
+    function deleteOccurrence() {
+      vm.component.remove(true).then(function() {
+        $rootScope.$broadcast('calendars:list');
+        $mdDialog.hide();
+      });
+    }
+
+    function deleteAllOccurrences() {
+      vm.component.remove().then(function() {
+        $rootScope.$broadcast('calendars:list');
+        $mdDialog.hide();
+      });
+    }
+}
 
   /**
    * @ngInject