From 68646f38a0072a74491d5a7a662c0325b69c7543 Mon Sep 17 00:00:00 2001 From: suba-1997 Date: Mon, 20 Jan 2025 18:30:51 +0530 Subject: [PATCH 1/4] 934883: Test and resolve issues in UG all sections - ASP core MVC Avatar component. --- .../avatar/EJ2_ASP.MVC/getting-started.md | 6 +- .../avatar/EJ2_ASP.NETCORE/getting-started.md | 6 +- .../avatar/how-to/avatar-customization.md | 10 +- .../how-to/integrate-avatar-into-badge.md | 6 +- .../how-to/integrate-avatar-into-listview.md | 10 +- ej2-asp-core-mvc/avatar/types.md | 20 +- .../code-snippet/avatar/badge/razor | 167 ++++++------ .../code-snippet/avatar/badge/tagHelper | 168 ++++++------ .../code-snippet/avatar/circle/razor | 12 +- .../code-snippet/avatar/circle/tagHelper | 12 +- .../code-snippet/avatar/color/razor | 50 ++-- .../code-snippet/avatar/color/tagHelper | 50 ++-- .../code-snippet/avatar/custom-size/razor | 42 +-- .../code-snippet/avatar/custom-size/tagHelper | 42 +-- .../code-snippet/avatar/default/razor | 12 +- .../code-snippet/avatar/default/tagHelper | 12 +- .../code-snippet/avatar/listview/razor | 25 +- .../code-snippet/avatar/listview/tagHelper | 251 +++++++++--------- .../code-snippet/avatar/media-formats/razor | 220 +++++++-------- .../avatar/media-formats/tagHelper | 229 ++++++++-------- .../code-snippet/avatar/size/razor | 3 +- .../code-snippet/avatar/size/tagHelper | 2 +- 22 files changed, 680 insertions(+), 675 deletions(-) diff --git a/ej2-asp-core-mvc/avatar/EJ2_ASP.MVC/getting-started.md b/ej2-asp-core-mvc/avatar/EJ2_ASP.MVC/getting-started.md index f7ccf7d573..ae950d186e 100644 --- a/ej2-asp-core-mvc/avatar/EJ2_ASP.MVC/getting-started.md +++ b/ej2-asp-core-mvc/avatar/EJ2_ASP.MVC/getting-started.md @@ -11,7 +11,7 @@ documentation: ug # Getting Started with ASP.NET MVC Avatar Control -This section briefly explains about how to include [ASP.NET MVC Avatar](https://www.syncfusion.com/aspnet-mvc-ui-controls/avatar) control in your ASP.NET MVC application using Visual Studio. +This section explains about how to include [ASP.NET MVC Avatar](https://www.syncfusion.com/aspnet-mvc-ui-controls/avatar) control in your ASP.NET MVC application using Visual Studio. ## Prerequisites @@ -25,7 +25,7 @@ This section briefly explains about how to include [ASP.NET MVC Avatar](https:// ## Add stylesheet -Here, the theme is referred using CDN inside the `` of `~/Views/Shared/_Layout.cshtml` file as follows, +Here, the desired theme is referred using CDN inside the `` of **~/Views/Shared/_Layout.cshtml** file as follows, {% tabs %} {% highlight c# tabtitle="~/_Layout.cshtml" %} @@ -43,7 +43,7 @@ N> Checkout the [Themes topic](https://ej2.syncfusion.com/aspnetmvc/documentatio ## Add ASP.NET MVC Avatar control -Now, add the Syncfusion® ASP.NET MVC Avatar control in `~/Home/Index.cshtml` page. +Now, add the Syncfusion® ASP.NET MVC Avatar control in **~/Home/Index.cshtml** page. {% tabs %} {% highlight razor tabtitle="CSHTML" %} diff --git a/ej2-asp-core-mvc/avatar/EJ2_ASP.NETCORE/getting-started.md b/ej2-asp-core-mvc/avatar/EJ2_ASP.NETCORE/getting-started.md index 9ed1e73d7b..feb3186806 100644 --- a/ej2-asp-core-mvc/avatar/EJ2_ASP.NETCORE/getting-started.md +++ b/ej2-asp-core-mvc/avatar/EJ2_ASP.NETCORE/getting-started.md @@ -11,7 +11,7 @@ documentation: ug # Getting Started with ASP.NET Core Avatar Control -This section briefly explains about how to include [ASP.NET Core Avatar](https://www.syncfusion.com/aspnet-core-ui-controls/avatar) control in your ASP.NET Core application using Visual Studio. +This section explains about how to include [ASP.NET Core Avatar](https://www.syncfusion.com/aspnet-core-ui-controls/avatar) control in your ASP.NET Core application using Visual Studio. ## Prerequisites @@ -25,7 +25,7 @@ This section briefly explains about how to include [ASP.NET Core Avatar](https:/ ## Add stylesheet -Here, the theme is referred using CDN inside the `` of `~/Pages/Shared/_Layout.cshtml` file as follows, +Here, the desired theme is referred using CDN inside the `` of **~/Pages/Shared/_Layout.cshtml** file as follows, {% tabs %} {% highlight cshtml tabtitle="~/_Layout.cshtml" %} @@ -43,7 +43,7 @@ N> Checkout the [Themes topic](https://ej2.syncfusion.com/aspnetcore/documentati ## Add ASP.NET Core Avatar control -Now, add the Syncfusion® ASP.NET Core Avatar tag helper in `~/Pages/Index.cshtml` page. +Now, add the Syncfusion® ASP.NET Core Avatar tag helper in **~/Pages/Index.cshtml** page. {% tabs %} {% highlight cshtml tabtitle="CSHTML" %} diff --git a/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md b/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md index 05b7121f83..50e291992d 100644 --- a/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md +++ b/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md @@ -12,7 +12,7 @@ documentation: ug ## Color customization -The avatar comes with default background color (Grey). This can be easily customized to desired color by adding custom class or directly selecting the avatar class from the CSS. +The Avatar comes with default background color (Grey). This can be easily customized to the desired color by adding custom class or directly selecting the Avatar class from the CSS. {% if page.publishingplatform == "aspnet-core" %} @@ -37,9 +37,9 @@ The avatar comes with default background color (Grey). This can be easily custom ![Avatar Color](../images/color.PNG) -## Customize avatar sizes +## Customize Avatar sizes -Even though the avatar comes with five predefined sizes, sometimes it's not enough. So, the avatar is designed in such a way that the width and height will be relative to font-size. By changing the `font-size` of the avatar element, you can change the width and height automatically. +Even though the Avatar comes with five predefined sizes, sometimes it's not enough. The Avatar is designed so that the width and height are relative to the font-size. By changing the `font-size` of the Avatar element, you can change the width and height automatically. {% if page.publishingplatform == "aspnet-core" %} @@ -66,9 +66,9 @@ Even though the avatar comes with five predefined sizes, sometimes it's not enou N> [View Sample in GitHub](https://github.com/SyncfusionExamples/ASP-NET-Core-UG-Examples/tree/main/Avatar/AvatarUGSample). -## Use various media in avatar +## Use various media in Avatar -Avatars can be used with a wide variety of media formats like SVG, font-icons, images, letters, words, etc. +Avatars can be used with a wide variety of types of media formats like SVG, font-icons, images, letters, words, etc. {% if page.publishingplatform == "aspnet-core" %} diff --git a/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md b/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md index 350da13087..bcedf080fb 100644 --- a/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md +++ b/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md @@ -1,16 +1,16 @@ --- layout: post title: Integrate Avatar Into Badge in ##Platform_Name## Avatar Component -description: Learn here all about how to integrate avatar into badge in Syncfusion ##Platform_Name## Avatar component of Syncfusion Essential JS 2 and more. +description: Learn here all about how to integrate Avatar into Badge in Syncfusion ##Platform_Name## Avatar component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Integrate Avatar Into Badge publishingplatform: ##Platform_Name## documentation: ug --- -# Integrate avatar into Badge +# Integrate Avatar into Badge -The badge is dependent and supportive component, and it can be used with avatar to create a notification avatar. The default avatar (.`e-avatar`) and circle avatar (.`e-avatar-circle`) have been used with notification badges (.`e-badge-notification`) in the following sample. +The Badge is a dependent and supportive component that can be used with Avatar to create a notification Avatar. The default Avatar `(.e-avatar)` and circle Avatar `(.e-avatar-circle)` have been used with notification badges `(.e-badge-notification)` in the following sample. {% if page.publishingplatform == "aspnet-core" %} diff --git a/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-listview.md b/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-listview.md index b4c994baaa..fc8979c332 100644 --- a/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-listview.md +++ b/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-listview.md @@ -1,16 +1,16 @@ --- layout: post -title: Integrate Avatar Into Listview in ##Platform_Name## Avatar Component -description: Learn here all about how to integrate avatar into Listview in Syncfusion ##Platform_Name## Avatar component of Syncfusion Essential JS 2 and more. +title: Integrate Avatar Into ListView in ##Platform_Name## Avatar Component +description: Learn here all about how to integrate Avatar into ListView in Syncfusion ##Platform_Name## Avatar component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc -control: Integrate Avatar Into Listview +control: Integrate Avatar Into ListView publishingplatform: ##Platform_Name## documentation: ug --- -# Integrate avatar into ListView +# Integrate Avatar into ListView -Avatar is integrated into the listview to create contacts applications. The `xsmall` size avatar is used to match the size of the list item. Letters and images are also used as avatar content. +Avatar is integrated into the ListView to create contacts applications. The `xsmall` size Avatar is used to match the size of the list items. Both letters and images are also used as Avatar content. {% if page.publishingplatform == "aspnet-core" %} diff --git a/ej2-asp-core-mvc/avatar/types.md b/ej2-asp-core-mvc/avatar/types.md index 560bd3b1af..1244f7b778 100644 --- a/ej2-asp-core-mvc/avatar/types.md +++ b/ej2-asp-core-mvc/avatar/types.md @@ -11,19 +11,19 @@ documentation: ug # Types and Styles in ##Platform_Name## Avatar Control -This section explains different types of avatar. +This section explains different types of Avatar. ## Avatar size -The Essential® JS 2 Avatar has the following predefined sizes that can be used with the `.e-avatar` class to change the appearance of the avatar. +The Essential® JS 2 Avatar has the following predefined sizes that can be used with the `.e-avatar` class to change the appearance of the Avatar. | Class Name | Description | | ------------- | ------------- | -| e-avatar-xlarge | Displays xlarge size avatar. | -| e-avatar-large | Displays apply large size avatar. | -| e-avatar | Displays apply default size avatar. | -| e-avatar-small | Displays apply small size avatar. | -| e-avatar-xsmall | Displays apply xsmall size avatar. | +| e-avatar-xlarge | Displays xlarge size Avatar. | +| e-avatar-large | Displays apply large size Avatar. | +| e-avatar | Displays apply default size Avatar. | +| e-avatar-small | Displays apply small size Avatar. | +| e-avatar-xsmall | Displays apply xsmall size Avatar. | {% if page.publishingplatform == "aspnet-core" %} @@ -50,14 +50,14 @@ The Essential® JS 2 Avatar has the followin ## Avatar types -The types of Essential® JS 2 avatar are: +The types of Essential® JS 2 Avatar are: * Default * Circle ### Default -The default style of the avatar is rectangular shape with rounded corners, which can be applied from adding the modifier class `.e-avatar` to the target element. +The default style of the Avatar is rectangular shape with rounded corners, which can be applied from adding the modifier class `.e-avatar` to the target element. {% if page.publishingplatform == "aspnet-core" %} @@ -83,7 +83,7 @@ The default style of the avatar is rectangular shape with rounded corners, which ### Circle -The circle avatar style can be applied by adding the modifier class `.e-avatar-circle` to the target element. +The circle Avatar style can be applied by adding the modifier class `.e-avatar-circle` to the target element. {% if page.publishingplatform == "aspnet-core" %} diff --git a/ej2-asp-core-mvc/code-snippet/avatar/badge/razor b/ej2-asp-core-mvc/code-snippet/avatar/badge/razor index 66eda5b2d3..a6634c0c4e 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/badge/razor +++ b/ej2-asp-core-mvc/code-snippet/avatar/badge/razor @@ -6,7 +6,7 @@
- profile_pic + profile_pic
6 @@ -14,7 +14,7 @@
- profile_pic + profile_pic
12 @@ -22,7 +22,7 @@
- profile_pic + profile_pic
46 @@ -30,7 +30,7 @@
- profile_pic + profile_pic
82 @@ -38,7 +38,7 @@
- profile_pic + profile_pic
99+ @@ -54,7 +54,7 @@
- profile_pic + profile_pic
6 @@ -62,7 +62,7 @@
- profile_pic + profile_pic
12 @@ -70,7 +70,7 @@
- profile_pic + profile_pic
46 @@ -78,7 +78,7 @@
- profile_pic + profile_pic
82 @@ -86,7 +86,7 @@
- profile_pic + profile_pic
99+ @@ -97,82 +97,85 @@
+ \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/badge/tagHelper b/ej2-asp-core-mvc/code-snippet/avatar/badge/tagHelper index 39851fd999..a6634c0c4e 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/badge/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/avatar/badge/tagHelper @@ -6,7 +6,7 @@
- profile_pic + profile_pic
6 @@ -14,7 +14,7 @@
- profile_pic + profile_pic
12 @@ -22,7 +22,7 @@
- profile_pic + profile_pic
46 @@ -30,7 +30,7 @@
- profile_pic + profile_pic
82 @@ -38,7 +38,7 @@
- profile_pic + profile_pic
99+ @@ -54,7 +54,7 @@
- profile_pic + profile_pic
6 @@ -62,7 +62,7 @@
- profile_pic + profile_pic
12 @@ -70,7 +70,7 @@
- profile_pic + profile_pic
46 @@ -78,7 +78,7 @@
- profile_pic + profile_pic
82 @@ -86,7 +86,7 @@
- profile_pic + profile_pic
99+ @@ -97,83 +97,85 @@
+ \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/circle/razor b/ej2-asp-core-mvc/code-snippet/avatar/circle/razor index ad7a756f99..c7bde28a76 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/circle/razor +++ b/ej2-asp-core-mvc/code-snippet/avatar/circle/razor @@ -7,10 +7,10 @@
\ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/circle/tagHelper b/ej2-asp-core-mvc/code-snippet/avatar/circle/tagHelper index ad7a756f99..c7bde28a76 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/circle/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/avatar/circle/tagHelper @@ -7,10 +7,10 @@
\ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/color/razor b/ej2-asp-core-mvc/code-snippet/avatar/color/razor index 0414195d42..eaf8bd4b4f 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/color/razor +++ b/ej2-asp-core-mvc/code-snippet/avatar/color/razor @@ -7,35 +7,35 @@
\ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/color/tagHelper b/ej2-asp-core-mvc/code-snippet/avatar/color/tagHelper index 0414195d42..eaf8bd4b4f 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/color/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/avatar/color/tagHelper @@ -7,35 +7,35 @@
\ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/custom-size/razor b/ej2-asp-core-mvc/code-snippet/avatar/custom-size/razor index f39c31a424..96667a9080 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/custom-size/razor +++ b/ej2-asp-core-mvc/code-snippet/avatar/custom-size/razor @@ -7,30 +7,30 @@
\ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/custom-size/tagHelper b/ej2-asp-core-mvc/code-snippet/avatar/custom-size/tagHelper index f39c31a424..96667a9080 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/custom-size/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/avatar/custom-size/tagHelper @@ -7,30 +7,30 @@
\ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/default/razor b/ej2-asp-core-mvc/code-snippet/avatar/default/razor index 15f713e422..187a33a9c3 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/default/razor +++ b/ej2-asp-core-mvc/code-snippet/avatar/default/razor @@ -7,10 +7,10 @@
\ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/default/tagHelper b/ej2-asp-core-mvc/code-snippet/avatar/default/tagHelper index 15f713e422..187a33a9c3 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/default/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/avatar/default/tagHelper @@ -7,10 +7,10 @@
\ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/listview/razor b/ej2-asp-core-mvc/code-snippet/avatar/listview/razor index a035266b1b..deacb0bc6b 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/listview/razor +++ b/ej2-asp-core-mvc/code-snippet/avatar/listview/razor @@ -1,16 +1,17 @@ @using Syncfusion.EJ2 +
@{ var template = "
" + - "${if(avatar!=='')}" + - "${avatar}" + - "${else}" + - " " + - "${/if}" + - "" + - "${text}
";} + "${if(avatar!=='')}" + + "${avatar}" + + "${else}" + + " " + + "${/if}" + + "" + + "${text}
";} @Html.EJS().ListView("letterAvatarList").Enable(true).DataSource((IEnumerable)ViewBag.dataSource).HeaderTitle("Contacts").ShowHeader(true).Template(template).SortOrder(Syncfusion.EJ2.Lists.SortOrder.Ascending).Render() @@ -102,18 +103,18 @@ /* Avatar images using 'background-image' property */ .pic01 { - background-image: url('./pic01.png'); + background-image: url('@Url.Content("https://ej2.syncfusion.com/aspnetmvc/Content/avatar/images/pic01.png")'); } .pic02 { - background-image: url('./pic02.png'); + background-image: url('@Url.Content("https://ej2.syncfusion.com/aspnetmvc/Content/avatar/images/pic02.png")'); } .pic03 { - background-image: url('./pic03.png'); + background-image: url('@Url.Content("https://ej2.syncfusion.com/aspnetmvc/Content/avatar/images/pic03.png")'); } .pic04 { - background-image: url('./pic04.png'); + background-image: url('@Url.Content("https://ej2.syncfusion.com/aspnetmvc/Content/avatar/images/pic04.png")'); } - + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/listview/tagHelper b/ej2-asp-core-mvc/code-snippet/avatar/listview/tagHelper index 3e3a134b88..38c9664ab9 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/listview/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/avatar/listview/tagHelper @@ -1,126 +1,127 @@ -@{ - var template = "
" + - "${if(avatar!=='')}" + - "${avatar}" + - "${else}" + - " " + - "${/if}" + - "" + - "${text}
"; - - List data = new List(); - data.Add(new { text = "Robert", id = "s_01", avatar= "", pic= "pic04" }); - data.Add(new { text = "Nancy", id = "s_02", avatar= "N", pic= "" }); - data.Add(new { text = "John", id = "s_03", pic= "pic01", avatar= "" }); - data.Add(new { text = "Andrew", id = "s_04", avatar= "A", pic= "" }); - data.Add(new { text = "Michael", id = "s_05", pic= "pic02", avatar= "" }); - data.Add(new { text = "Steven", id = "s_06", pic= "pic03", avatar= "" }); - data.Add(new { text = "Margaret", id = "s_07", avatar= "M", pic= "" }); -} -
- - -
- - - +
+ + +
+ + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/media-formats/razor b/ej2-asp-core-mvc/code-snippet/avatar/media-formats/razor index 581e772b07..47002e2b74 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/media-formats/razor +++ b/ej2-asp-core-mvc/code-snippet/avatar/media-formats/razor @@ -85,119 +85,121 @@ \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/media-formats/tagHelper b/ej2-asp-core-mvc/code-snippet/avatar/media-formats/tagHelper index 39fdd4b39c..c4e4666749 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/media-formats/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/avatar/media-formats/tagHelper @@ -1,11 +1,4 @@ -@page -@model AvatarUGSample.Pages.VariousAvatarMediaModel - -@{ - -} - -
+
@@ -92,119 +85,121 @@
\ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/size/razor b/ej2-asp-core-mvc/code-snippet/avatar/size/razor index 0d1514720c..5c393e0e3c 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/size/razor +++ b/ej2-asp-core-mvc/code-snippet/avatar/size/razor @@ -15,6 +15,7 @@ } .e-avatar { - background-image: url(./pic01.png); + background-image: url('@Url.Content("https://ej2.syncfusion.com/aspnetmvc/Content/avatar/images/pic01.png")'); + margin: 2px; } \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/size/tagHelper b/ej2-asp-core-mvc/code-snippet/avatar/size/tagHelper index fddf9e54b7..3b652b7279 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/size/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/avatar/size/tagHelper @@ -15,6 +15,6 @@ } .e-avatar { - background-image: url(@Url.Content("~/css/avatar/images/pic01.png")); + background-image: url('@Url.Content("https://ej2.syncfusion.com/aspnetmvc/Content/avatar/images/pic01.png")'); } \ No newline at end of file From b3fcf7417f5ba84eb2d35006c2945f4f307af134 Mon Sep 17 00:00:00 2001 From: suba-1997 Date: Mon, 20 Jan 2025 18:36:11 +0530 Subject: [PATCH 2/4] 934883: Test and resolve issues in UG all sections - ASP core MVC Avatar component. --- ej2-asp-core-mvc/avatar/how-to/avatar-customization.md | 4 ++-- .../avatar/how-to/integrate-avatar-into-badge.md | 6 +++--- .../avatar/how-to/integrate-avatar-into-listview.md | 4 ++-- ej2-asp-core-mvc/avatar/overview.md | 4 ++-- 4 files changed, 9 insertions(+), 9 deletions(-) diff --git a/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md b/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md index 50e291992d..ec607b3213 100644 --- a/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md +++ b/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md @@ -1,7 +1,7 @@ --- layout: post -title: Avatar Customization in ##Platform_Name## Avatar Component | Syncfusion -description: Learn here all about Avatar Customization in Syncfusion ##Platform_Name## Avatar component of Syncfusion Essential JS 2 and more. +title: Avatar Customization in ##Platform_Name## Avatar control | Syncfusion +description: Learn here all about Avatar Customization in Syncfusion ##Platform_Name## Avatar control of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Avatar Customization publishingplatform: ##Platform_Name## diff --git a/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md b/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md index bcedf080fb..ab68d686e6 100644 --- a/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md +++ b/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md @@ -1,7 +1,7 @@ --- layout: post -title: Integrate Avatar Into Badge in ##Platform_Name## Avatar Component -description: Learn here all about how to integrate Avatar into Badge in Syncfusion ##Platform_Name## Avatar component of Syncfusion Essential JS 2 and more. +title: Integrate Avatar Into Badge in ##Platform_Name## Avatar control +description: Learn here all about how to integrate Avatar into Badge in Syncfusion ##Platform_Name## Avatar control of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Integrate Avatar Into Badge publishingplatform: ##Platform_Name## @@ -10,7 +10,7 @@ documentation: ug # Integrate Avatar into Badge -The Badge is a dependent and supportive component that can be used with Avatar to create a notification Avatar. The default Avatar `(.e-avatar)` and circle Avatar `(.e-avatar-circle)` have been used with notification badges `(.e-badge-notification)` in the following sample. +The Badge is a dependent and supportive control that can be used with Avatar to create a notification Avatar. The default Avatar `(.e-avatar)` and circle Avatar `(.e-avatar-circle)` have been used with notification badges `(.e-badge-notification)` in the following sample. {% if page.publishingplatform == "aspnet-core" %} diff --git a/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-listview.md b/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-listview.md index fc8979c332..5268e0eef3 100644 --- a/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-listview.md +++ b/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-listview.md @@ -1,7 +1,7 @@ --- layout: post -title: Integrate Avatar Into ListView in ##Platform_Name## Avatar Component -description: Learn here all about how to integrate Avatar into ListView in Syncfusion ##Platform_Name## Avatar component of Syncfusion Essential JS 2 and more. +title: Integrate Avatar Into ListView in ##Platform_Name## Avatar control +description: Learn here all about how to integrate Avatar into ListView in Syncfusion ##Platform_Name## Avatar control of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Integrate Avatar Into ListView publishingplatform: ##Platform_Name## diff --git a/ej2-asp-core-mvc/avatar/overview.md b/ej2-asp-core-mvc/avatar/overview.md index 54c959b31f..ea9ed9793d 100644 --- a/ej2-asp-core-mvc/avatar/overview.md +++ b/ej2-asp-core-mvc/avatar/overview.md @@ -1,7 +1,7 @@ --- layout: post -title: Overview in ##Platform_Name## Avatar Component -description: Learn here all about Overview in Syncfusion ##Platform_Name## Avatar component of Syncfusion Essential JS 2 and more. +title: Overview in ##Platform_Name## Avatar control +description: Learn here all about Overview in Syncfusion ##Platform_Name## Avatar control of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Index publishingplatform: ##Platform_Name## From 838037ac89c4a2265c6f336b79cdf9d9044aa142 Mon Sep 17 00:00:00 2001 From: suba-1997 Date: Tue, 21 Jan 2025 13:04:30 +0530 Subject: [PATCH 3/4] 934883: Test and resolve issues in UG all sections - ASP core MVC Avatar control. --- ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md | 2 +- .../avatar/how-to/integrate-avatar-into-listview.md | 2 +- ej2-asp-core-mvc/avatar/overview.md | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md b/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md index ab68d686e6..77795bb828 100644 --- a/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md +++ b/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-badge.md @@ -1,6 +1,6 @@ --- layout: post -title: Integrate Avatar Into Badge in ##Platform_Name## Avatar control +title: Integrate Avatar Into Badge in ##Platform_Name## Avatar control | Syncfusion description: Learn here all about how to integrate Avatar into Badge in Syncfusion ##Platform_Name## Avatar control of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Integrate Avatar Into Badge diff --git a/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-listview.md b/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-listview.md index 5268e0eef3..598540a5b1 100644 --- a/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-listview.md +++ b/ej2-asp-core-mvc/avatar/how-to/integrate-avatar-into-listview.md @@ -1,6 +1,6 @@ --- layout: post -title: Integrate Avatar Into ListView in ##Platform_Name## Avatar control +title: Integrate Avatar Into ListView in ##Platform_Name## Avatar control | Syncfusion description: Learn here all about how to integrate Avatar into ListView in Syncfusion ##Platform_Name## Avatar control of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Integrate Avatar Into ListView diff --git a/ej2-asp-core-mvc/avatar/overview.md b/ej2-asp-core-mvc/avatar/overview.md index ea9ed9793d..c24cee7707 100644 --- a/ej2-asp-core-mvc/avatar/overview.md +++ b/ej2-asp-core-mvc/avatar/overview.md @@ -1,6 +1,6 @@ --- layout: post -title: Overview in ##Platform_Name## Avatar control +title: Overview in ##Platform_Name## Avatar control | Syncfusion description: Learn here all about Overview in Syncfusion ##Platform_Name## Avatar control of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Index From a692c0f55911d0c35f44730330da6da72e77d04a Mon Sep 17 00:00:00 2001 From: suba-1997 Date: Thu, 23 Jan 2025 10:00:10 +0530 Subject: [PATCH 4/4] 934883: Test and resolve issues in UG all sections - ASP core MVC Avatar control. --- .../code-snippet/avatar/listview/razor | 207 +++++++--------- .../code-snippet/avatar/listview/tagHelper | 230 ++++++++---------- 2 files changed, 195 insertions(+), 242 deletions(-) diff --git a/ej2-asp-core-mvc/code-snippet/avatar/listview/razor b/ej2-asp-core-mvc/code-snippet/avatar/listview/razor index deacb0bc6b..d079eee680 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/listview/razor +++ b/ej2-asp-core-mvc/code-snippet/avatar/listview/razor @@ -1,120 +1,89 @@ -@using Syncfusion.EJ2 - -
- -
- - @{ var template = "
" + - "${if(avatar!=='')}" + - "${avatar}" + - "${else}" + - " " + - "${/if}" + - "" + - "${text}
";} - @Html.EJS().ListView("letterAvatarList").Enable(true).DataSource((IEnumerable)ViewBag.dataSource).HeaderTitle("Contacts").ShowHeader(true).Template(template).SortOrder(Syncfusion.EJ2.Lists.SortOrder.Ascending).Render() - - - - - \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/avatar/listview/tagHelper b/ej2-asp-core-mvc/code-snippet/avatar/listview/tagHelper index 38c9664ab9..020a9bdbc9 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/listview/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/avatar/listview/tagHelper @@ -1,127 +1,111 @@ @{ -var template = "
" + - "${if(avatar!=='')}" + - "${avatar}" + - "${else}" + - " " + - "${/if}" + - "" + + var template = "
" + + "${if(avatar!=='')}" + + "${avatar}" + + "${else}" + + " " + + "${/if}" + + "" + "${text}
"; -List data = new List(); - data.Add(new { text = "Robert", id = "s_01", avatar= "", pic= "pic04" }); - data.Add(new { text = "Nancy", id = "s_02", avatar= "N", pic= "" }); - data.Add(new { text = "John", id = "s_03", pic= "pic01", avatar= "" }); - data.Add(new { text = "Andrew", id = "s_04", avatar= "A", pic= "" }); - data.Add(new { text = "Michael", id = "s_05", pic= "pic02", avatar= "" }); - data.Add(new { text = "Steven", id = "s_06", pic= "pic03", avatar= "" }); - data.Add(new { text = "Margaret", id = "s_07", avatar= "M", pic= "" }); - } -
- data = new List < object > (); + data.Add(new { text = "Robert", id = "s_01", avatar= "", pic= "pic04" }); + data.Add(new { text = "Nancy", id = "s_02", avatar= "N", pic= "" }); + data.Add(new { text = "John", id = "s_03", pic= "pic01", avatar= "" }); + data.Add(new { text = "Andrew", id = "s_04", avatar= "A", pic= "" }); + data.Add(new { text = "Michael", id = "s_05", pic= "pic02", avatar= "" }); + data.Add(new { text = "Steven", id = "s_06", pic= "pic03", avatar= "" }); + data.Add(new { text = "Margaret", id = "s_07", avatar= "M", pic= "" }); +} +
+ - -
- - - \ No newline at end of file + +
+ + + \ No newline at end of file