diff --git a/template/app/view/comments/List.js b/template/app/view/comments/List.js
index b115e4a980c6638deef8bcc8b338bf5fecba2287..622b4f670ff4c6fef8577627744d2e116d3bdf38 100644
--- a/template/app/view/comments/List.js
+++ b/template/app/view/comments/List.js
@@ -36,7 +36,8 @@ Ext.define('Docs.view.comments.List', {
                 "score",
                 "upVote",
                 "downVote",
-                "contentHtml"
+                "contentHtml",
+                "deleted"
             ]
         });
 
@@ -63,6 +64,12 @@ Ext.define('Docs.view.comments.List', {
         this.delegateClick("a.editComment", function(el, r) {
             this.edit(el, r);
         }, this);
+        this.delegateClick("a.deleteComment", function(el, r) {
+            this.setDeleted(el, r, true);
+        }, this);
+        this.delegateClick("a.undoDeleteComment", function(el, r) {
+            this.setDeleted(el, r, false);
+        }, this);
     },
 
     delegateClick: function(selector, callback, scope) {
@@ -162,6 +169,25 @@ Ext.define('Docs.view.comments.List', {
         });
     },
 
+    // marks the comment as deleted or undoes the delete
+    setDeleted: function(el, comment, deleted) {
+        Docs.Comments.request("ajax", {
+            url: '/comments/' + comment.get("_id") + (deleted ? '/delete' : '/undo_delete'),
+            method: 'POST',
+            callback: function(options, success, response) {
+                var data = Ext.JSON.decode(response.responseText);
+                if (data.success) {
+                    comment.set("deleted", deleted);
+                    comment.commit();
+                }
+                else {
+                    Ext.Msg.alert('Error', data.reason || "There was an error submitting your request");
+                }
+            },
+            scope: this
+        });
+    },
+
     /**
      * Loads array of comments into the view.
      * @param {Object[]} comments
diff --git a/template/app/view/comments/Template.js b/template/app/view/comments/Template.js
index e9c310d4f9148d2935687d1d2c592266329ac6c9..e36aa105d1b716b2250cbde5bf34cc7b74e8df82 100644
--- a/template/app/view/comments/Template.js
+++ b/template/app/view/comments/Template.js
@@ -38,30 +38,34 @@ Ext.define('Docs.view.comments.Template', {
             '<div class="comment-list">',
                 '<tpl for=".">',
                 '<div class="comment" id="{id}">',
-                    '<div class="com-meta">',
-                        '{[Docs.Comments.avatar(values.emailHash)]}',
-                        '<div class="author<tpl if="moderator"> moderator" title="Sencha Engineer</tpl>">',
-                            '{author}',
-                            '<tpl if="this.isTargetVisible()">',
-                                '<span class="target"> on {[this.target(values.target)]}</span>',
+                    '<tpl if="deleted">',
+                        '<div class="deleted-comment">Comment was deleted. <a href="#" class="undoDeleteComment">Undo</a>.</div>',
+                    '<tpl else>',
+                        '<div class="com-meta">',
+                            '{[Docs.Comments.avatar(values.emailHash)]}',
+                            '<div class="author<tpl if="moderator"> moderator" title="Sencha Engineer</tpl>">',
+                                '{author}',
+                                '<tpl if="this.isTargetVisible()">',
+                                    '<span class="target"> on {[this.target(values.target)]}</span>',
+                                '</tpl>',
+                            '</div>',
+                            '<tpl if="this.isMod()">',
+                                '<a href="#" class="readComment <tpl if="read">read</tpl>">Read</a>',
                             '</tpl>',
+                            '<tpl if="this.isMod() || this.isAuthor(values.author)">',
+                                '<a href="#" class="editComment">Edit</a><a href="#" class="deleteComment">Delete</a>',
+                            '</tpl>',
+                            '<div class="time" title="{[this.date(values.createdAt)]}">{[this.dateStr(values.createdAt)]}</div>',
+                            '<div class="vote">',
+                                '<a href="#" class="voteCommentUp{[values.upVote ? " selected" : ""]}" ',
+                                            'title="Vote Up">&nbsp;</a>',
+                                '<span class="score">{score}</span>',
+                                '<a href="#" class="voteCommentDown{[values.downVote ? " selected" : ""]}" ',
+                                            'title="Vote Down">&nbsp;</a>',
+                            '</div>',
                         '</div>',
-                        '<tpl if="this.isMod()">',
-                            '<a href="#" class="readComment <tpl if="read">read</tpl>">Read</a>',
-                        '</tpl>',
-                        '<tpl if="this.isMod() || this.isAuthor(values.author)">',
-                            '<a href="#" class="editComment">Edit</a><a href="#" class="deleteComment">Delete</a>',
-                        '</tpl>',
-                        '<div class="time" title="{[this.date(values.createdAt)]}">{[this.dateStr(values.createdAt)]}</div>',
-                        '<div class="vote">',
-                            '<a href="#" class="voteCommentUp{[values.upVote ? " selected" : ""]}" ',
-                                        'title="Vote Up">&nbsp;</a>',
-                            '<span class="score">{score}</span>',
-                            '<a href="#" class="voteCommentDown{[values.downVote ? " selected" : ""]}" ',
-                                        'title="Vote Down">&nbsp;</a>',
-                        '</div>',
-                    '</div>',
-                    '<div class="content">{contentHtml}</div>',
+                        '<div class="content">{contentHtml}</div>',
+                    '</tpl>',
                 '</div>',
                 '</tpl>',
                 '<div class="new-comment-wrap"></div>',