Skip to content

Commit 042b07a

Browse files
Kokila13081999Kokila13081999
committed
988174: Rich Text Editor Missing topics Are Added
1 parent ba18d45 commit 042b07a

File tree

42 files changed

+1356
-16
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+1356
-16
lines changed

‎ej2-asp-core-mvc/code-snippet/rich-text-editor/cell-selection/controller.cs‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
public class HomeController : Controller
2+
{
3+
4+
public ActionResult Index()
5+
{
6+
ViewBag.value = @"<p>This is paragraph one.</p><p>This is paragraph two.</p>"
7+
return View();
8+
}
9+
}

‎ej2-asp-core-mvc/code-snippet/rich-text-editor/cell-selection/razor‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
2+
<button class="e-btn" style="margin-bottom: 20px;" onclick="selectCell()">
3+
Select Paragraph
4+
</button>
5+
6+
@Html.EJS().RichTextEditor("cellSelectionRTE").Value(ViewBag.value).Render()
7+
8+
<script>
9+
function selectCell() {
10+
const panel = document.getElementById("cellSelectionRTE").ej2_instances[0].contentModule.getEditPanel();
11+
const cells = panel.querySelectorAll('td');
12+
13+
if (cells.length > 2) {
14+
const cell = cells[2]; // Third cell
15+
const range = document.createRange();
16+
range.selectNode(cell);
17+
18+
const selection = window.getSelection();
19+
if (selection) {
20+
selection.removeAllRanges();
21+
selection.addRange(range);
22+
}
23+
24+
cell.style.backgroundColor = '#cce5ff';
25+
cell.classList.add('e-cell-select');
26+
}
27+
28+
}
29+
</script>
30+

‎ej2-asp-core-mvc/code-snippet/rich-text-editor/cell-selection/tagHelper‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
2+
<button class="e-btn" style="margin-bottom: 20px;" onclick="selectCell()">
3+
Select Cell
4+
</button>
5+
6+
<ejs-richtexteditor id="cellSelectionRTE" value="@ViewBag.value">
7+
</ejs-richtexteditor>
8+
9+
<script>
10+
function selectCell() {
11+
const panel = document.getElementById("cellSelectionRTE").ej2_instances[0].contentModule.getEditPanel();
12+
const cells = panel.querySelectorAll('td');
13+
14+
if (cells.length > 2) {
15+
const cell = cells[2]; // Third cell
16+
const range = document.createRange();
17+
range.selectNode(cell);
18+
19+
const selection = window.getSelection();
20+
if (selection) {
21+
selection.removeAllRanges();
22+
selection.addRange(range);
23+
}
24+
25+
cell.style.backgroundColor = '#cce5ff';
26+
cell.classList.add('e-cell-select');
27+
}
28+
29+
}
30+
</script>

‎ej2-asp-core-mvc/code-snippet/rich-text-editor/mention-min-length/EmployeeData.cs‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Linq;
4+
using System.Threading.Tasks;
5+
6+
namespace WebApplication1.Models
7+
{
8+
public class EmployeeData
9+
{
10+
public string Name { get; set; }
11+
public string EmailId { get; set; }
12+
13+
public List<EmployeeData> EmployeeList()
14+
{
15+
List<EmployeeData> mention = new List<EmployeeData>()
16+
{
17+
new EmployeeData { Name = "Selma Rose" EmailId = "selma@gmail.com" },
18+
new EmployeeData { Name = "Russo Kay", EmailId = "russo@gmail.com" },
19+
new EmployeeData { Name = "Camden Kate", EmailId = "camden@gmail.com" },
20+
new EmployeeData { Name = "Mary Kate", EmailId = "mary@gmail.com" },
21+
new EmployeeData { Name = "Ursula Ann", EmailId = "ursula@gmail.com" },
22+
new EmployeeData { Name = "Margaret", EmailId = "margaret@gmail.com" },
23+
};
24+
return mention;
25+
}
26+
27+
}
28+
}

‎ej2-asp-core-mvc/code-snippet/rich-text-editor/mention-min-length/razor‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
@{
2+
List<EmployeeData> data = new EmployeeData().EmployeeList();
3+
4+
string value = @"<p>Hello <span contenteditable=""false"" class=""e-mention-chip""><a title=""maria@gmail.com"">@@Maria</a></span>&#8203;</p>
5+
<p>Welcome to the mention integration with rich text editor demo. Type <code>@@</code> character and tag user from the suggestion list. </p>";
6+
}
7+
8+
@Html.EJS().RichTextEditor("mentionIntegration").Value(value).Render()
9+
10+
@Html.EJS().Mention("mentionRTE").Target("#mentionIntegration_rte-edit-view").DataSource((IEnumerable<EmployeeData>)data).MinLength(3).Fields(new Syncfusion.EJ2.DropDowns.MentionFieldSettings { Text = "Name", Value="EmailId" }).Render()

‎ej2-asp-core-mvc/code-snippet/rich-text-editor/mention-min-length/tagHelper‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
@{
2+
List<EmployeeData> data = new EmployeeData().EmployeeList();
3+
4+
string value = @"<p>Hello <span contenteditable=""false"" class=""e-mention-chip""><a title=""maria@gmail.com"">@@Maria</a></span>&#8203;</p>
5+
<p>Welcome to the mention integration with rich text editor demo. Type <code>@@</code> character and tag user from the suggestion list. </p>";
6+
}
7+
8+
<ejs-richtexteditor id="mention_integration" placeholder="Type @@ and tag the name" value="@value"></ejs-richtexteditor>
9+
10+
<ejs-mention id="mention" target="#mention_integration_rte-edit-view" dataSource="@data" minLength="3" suggestionCount="8" >
11+
<e-mention-fields text="Name" Value="EmailId"></e-mention-fields>
12+
</ejs-mention>

‎ej2-asp-core-mvc/code-snippet/rich-text-editor/mention-suggestion-count/EmployeeData.cs‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.Linq;
4+
using System.Threading.Tasks;
5+
6+
namespace WebApplication1.Models
7+
{
8+
public class EmployeeData
9+
{
10+
public string Name { get; set; }
11+
public string EmailId { get; set; }
12+
13+
public List<EmployeeData> EmployeeList()
14+
{
15+
List<EmployeeData> mention = new List<EmployeeData>()
16+
{
17+
new EmployeeData { Name = "Selma Rose" EmailId = "selma@gmail.com" },
18+
new EmployeeData { Name = "Russo Kay", EmailId = "russo@gmail.com" },
19+
new EmployeeData { Name = "Camden Kate", EmailId = "camden@gmail.com" },
20+
new EmployeeData { Name = "Mary Kate", EmailId = "mary@gmail.com" },
21+
new EmployeeData { Name = "Ursula Ann", EmailId = "ursula@gmail.com" },
22+
new EmployeeData { Name = "Margaret", EmailId = "margaret@gmail.com" },
23+
new EmployeeData { Name = "Laura Grace", EmailId = "laura@gmail.com" },
24+
new EmployeeData { Name = "Robert", EmailId = "robert@gmail.com" },
25+
new EmployeeData { Name = "Albert", EmailId = "albert@gmail.com" },
26+
new EmployeeData { Name = "Michale", EmailId = "michale@gmail.com" },
27+
new EmployeeData { Name = "Andrew James", EmailId = "james@gmail.com" },
28+
new EmployeeData { Name = "Rosalie", EmailId = "rosalie@gmail.com" },
29+
new EmployeeData { Name = "Stella Ruth", EmailId = "stella@gmail.com" },
30+
new EmployeeData { Name = "Richard Rose", EmailId = "richard@gmail.com" },
31+
new EmployeeData { Name = "Gabrielle", EmailId = "gabrielle@gmail.com" },
32+
new EmployeeData { Name = "Thomas", EmailId = "thomas@gmail.com" },
33+
};
34+
return mention;
35+
}
36+
37+
}
38+
}

‎ej2-asp-core-mvc/code-snippet/rich-text-editor/mention-suggestion-count/razor‎

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
@{
2+
List<EmployeeData> data = new EmployeeData().EmployeeList();
3+
4+
string value = @"<p>Hello <span contenteditable=""false"" class=""e-mention-chip""><a title=""maria@gmail.com"">@@Maria</a></span>&#8203;</p>
5+
<p>Welcome to the mention integration with rich text editor demo. Type <code>@@</code> character and tag user from the suggestion list. </p>";
6+
}
7+
8+
@Html.EJS().RichTextEditor("mentionIntegration").Value(value).Render()
9+
10+
@Html.EJS().Mention("mentionRTE").Target("#mentionIntegration_rte-edit-view").DataSource((IEnumerable<EmployeeData>)data).Fields(new Syncfusion.EJ2.DropDowns.MentionFieldSettings { Text = "Name", Value="EmailId" }).SuggestionCount(5).Render()
11+
12+
<style>
13+
#mention-TemplateList {
14+
position: relative;
15+
display: inline-block;
16+
padding:2px;
17+
}
18+
19+
.person, .email {
20+
display: block;
21+
line-height: 20px;
22+
text-indent: 5px;
23+
}
24+
25+
.person {
26+
font-size: 16px;
27+
}
28+
29+
.mentionEmpImage {
30+
display: inline-block;
31+
width: 46px;
32+
height: 46px;
33+
padding: 3px;
34+
border-radius: 25px;
35+
}
36+
37+
#mention-TemplateList .e-badge-success {
38+
left: 76%;
39+
bottom: 4px;
40+
top: auto;
41+
}
42+
43+
#mention_integration_rte-edit-view_popup .e-dropdownbase .e-list-item {
44+
line-height: 8px;
45+
}
46+
47+
#mention-TemplateList .e-badge-success {
48+
background-color: #4d841d;
49+
color: #fff;
50+
}
51+
52+
#mention-TemplateList .e-badge-success.away {
53+
background-color: #fedd2d;
54+
color: #fff;
55+
}
56+
57+
#mention-TemplateList .e-badge-success.busy {
58+
background-color: #de1a1a;
59+
color: #fff;
60+
}
61+
62+
#mention-TemplateList .e-badge.e-badge-dot {
63+
height: 10px;
64+
width: 10px;
65+
}
66+
#mentionIntegration .e-mention-chip{
67+
cursor: pointer;
68+
}
69+
</style>

‎ej2-asp-core-mvc/code-snippet/rich-text-editor/mention-suggestion-count/tagHelper‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
@{
2+
List<EmployeeData> data = new EmployeeData().EmployeeList();
3+
4+
string value = @"<p>Hello <span contenteditable=""false"" class=""e-mention-chip""><a title=""maria@gmail.com"">@@Maria</a></span>&#8203;</p>
5+
<p>Welcome to the mention integration with rich text editor demo. Type <code>@@</code> character and tag user from the suggestion list. </p>";
6+
}
7+
8+
<ejs-richtexteditor id="mention_integration" placeholder="Type @@ and tag the name" value="@value"></ejs-richtexteditor>
9+
10+
<ejs-mention id="mention" target="#mention_integration_rte-edit-view" dataSource="@data" suggestionCount="5" >
11+
<e-mention-fields text="Name" Value="EmailId"></e-mention-fields>
12+
</ejs-mention>

‎ej2-asp-core-mvc/code-snippet/rich-text-editor/nested-quotation-formatting/controller.cs‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
public class HomeController : Controller
2+
{
3+
public ActionResult Index()
4+
{
5+
ViewBag.value = @"<blockquote>
6+
<p><strong>Outer Quote:</strong> The Rich Text Editor provides a flexible way to format quotations.</p>
7+
<blockquote>
8+
<p><em>Inner Quote:</em> You can even nest blockquotes to represent quoted replies or layered citations.</p>
9+
<blockquote>
10+
<p><em>Deep Quote:</em> This is useful in forums, emails, or academic writing where multiple levels of quoting are needed.</p>
11+
</blockquote>
12+
</blockquote>
13+
</blockquote>";
14+
return View();
15+
}
16+
}

0 commit comments

Comments
 (0)