Skip to content

904164: Added Comment Event in Core and MVC #3755

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
May 2, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
public ActionResult Default()
{
return View();
}

Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
public ActionResult Default()
{
return View();
}

Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@

@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>
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@

<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>
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
public ActionResult Default()
{
return View();
}

45 changes: 41 additions & 4 deletions ej2-asp-core-mvc/document-editor/comments.md
Original file line number Diff line number Diff line change
Expand Up @@ -153,7 +153,9 @@ Document editor provides an option to protect and unprotect document using `enfo
{% include code-snippet/document-editor-container/comment-only-protect/tagHelper %}
{% endhighlight %}
{% highlight c# tabtitle="Comment-only.cs" %}
{% endhighlight %}{% endtabs %}
{% include code-snippet/document-editor-container/comment-only-protect/document-editor.cs %}
{% endhighlight %}
{% endtabs %}

{% elsif page.publishingplatform == "aspnet-mvc" %}

Expand All @@ -162,7 +164,9 @@ Document editor provides an option to protect and unprotect document using `enfo
{% include code-snippet/document-editor-container/comment-only-protect/razor %}
{% endhighlight %}
{% highlight c# tabtitle="Comment-only.cs" %}
{% endhighlight %}{% endtabs %}
{% include code-snippet/document-editor-container/comment-only-protect/document-editor.cs %}
{% endhighlight %}
{% endtabs %}
{% endif %}


Expand All @@ -185,7 +189,9 @@ The following example illustrates how to enable mention support in Document Edit
{% include code-snippet/document-editor-container/comments-mention/tagHelper %}
{% endhighlight %}
{% highlight c# tabtitle="comments-mention.cs" %}
{% endhighlight %}{% endtabs %}
{% include code-snippet/document-editor-container/comments-mention/document-editor.cs %}
{% endhighlight %}
{% endtabs %}

{% elsif page.publishingplatform == "aspnet-mvc" %}

Expand All @@ -194,5 +200,36 @@ The following example illustrates how to enable mention support in Document Edit
{% include code-snippet/document-editor-container/comments-mention/razor %}
{% endhighlight %}
{% highlight c# tabtitle="comments-mention.cs" %}
{% endhighlight %}{% endtabs %}
{% include code-snippet/document-editor-container/comments-mention/document-editor.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" %}
{% include code-snippet/document-editor-container/comments-event/document-editor.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" %}
{% include code-snippet/document-editor-container/comments-event/document-editor.cs %}
{% endhighlight %}
{% endtabs %}
{% endif %}