904164: Added Comment Event in Core and MVC

Author: KAVITHAMURALITHARAN

ej2-asp-core-mvc/code-snippet/document-editor-container/comments-event/razor

@@ -0,0 +1,22 @@
+@Html.EJS().DocumentEditorContainer("container").EnableToolbar(true).Height("590px").BeforeCommentAction("beforeComment").Render()
+<script>
+    var documenteditor;
+    var container;
+    function onCreated() {
+        var documenteditorElement = document.getElementById('container');
+        container = documenteditorElement.ej2_instances[0];
+        documenteditor = container.documentEditor;
+        let mentionData = [
+            { "Name": "Mary Kate", "EmailId": "marry@company.com" },
+            { "Name": "Andrew James", "EmailId": "james@company.com" },
+            { "Name": "Andrew Fuller", "EmailId": "andrew@company.com" }
+        ];
+        container.documentEditorSettings.mentionSettings = { dataSource: mentionData, fields: { text: 'Name' } };
+        container.currentUser = "Guest User";
+    }
+    function beforeComment(args) {
+        if (args.type === "Delete" && container.currentUser !== args.author) {
+            args.cancel = true;
+        }
+    }
+</script>

ej2-asp-core-mvc/code-snippet/document-editor-container/comments-event/tagHelper

@@ -0,0 +1,23 @@
+<ejs-documenteditorcontainer id="container" serviceUrl="/api/DocumentEditor/" enableToolbar=true created="onCreated" beforeCommentAction="beforeComment" height="590px"></ejs-documenteditorcontainer>
+
+<script>
+    var documenteditor;
+    var container;
+    function onCreated() {
+        var documenteditorElement = document.getElementById('container');
+        container = documenteditorElement.ej2_instances[0];
+        documenteditor = container.documentEditor;
+        let mentionData = [
+            { "Name": "Mary Kate", "EmailId": "marry@company.com" },
+            { "Name": "Andrew James", "EmailId": "james@company.com" },
+            { "Name": "Andrew Fuller", "EmailId": "andrew@company.com"}
+        ];
+        container.documentEditorSettings.mentionSettings = { dataSource: mentionData, fields: { text: 'Name' }};
+        container.currentUser = "Guest User";
+    }
+    function beforeComment(args){
+        if(args.type === "Delete" && container.currentUser !== args.author){
+            args.cancel = true;
+        }
+    }
+</script>

ej2-asp-core-mvc/document-editor/comments.md

@@ -196,3 +196,28 @@ The following example illustrates how to enable mention support in Document Edit
 {% highlight c# tabtitle="comments-mention.cs" %}
 {% endhighlight %}{% endtabs %}
 {% endif %}
+
+## Events
+
+DocumentEditor provides `beforeCommentAction` event, which is triggered on comment actions like Post, edit, reply, resolve and reopen. This event provides an opportunity to perform custom logic on comment actions like Post, edit, reply, resolve and reopen. The event handler receives the `CommentActionEventArgs` object as an argument, which allows access to information about the comment.
+
+To demonstrate a specific use case, let’s consider an example where we want to restrict the delete functionality based on the author’s name. The following code snippet illustrates how to allow only the author of a comment to delete:
+
+{% if page.publishingplatform == "aspnet-core" %}
+
+{% tabs %}
+{% highlight cshtml tabtitle="CSHTML" %}
+{% include code-snippet/document-editor-container/comments-event/tagHelper %}
+{% endhighlight %}
+{% highlight c# tabtitle="comments-event.cs" %}
+{% endhighlight %}{% endtabs %}
+
+{% elsif page.publishingplatform == "aspnet-mvc" %}
+
+{% tabs %}
+{% highlight razor tabtitle="CSHTML" %}
+{% include code-snippet/document-editor-container/comments-event/razor %}
+{% endhighlight %}
+{% highlight c# tabtitle="comments-event.cs" %}
+{% endhighlight %}{% endtabs %}
+{% endif %}