Skip to content

Commit 2077ccc

Browse files
NithyaSivaprakasamNithyaSivaprakasam
authored
Merge branch 'hotfix/hotfix-v29.1.33' into 948947-Mysql-server-new
2 parents d196d41 + ede50f2 commit 2077ccc

File tree

27 files changed

+3953
-632
lines changed

27 files changed

+3953
-632
lines changed

‎ej2-asp-core-mvc/chart/EJ2_ASP.MVC/chart-types/stacked-column.md

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -442,6 +442,64 @@ Stack labels have various properties for customization to enhance the visual bas
442442

443443

444444

445+
## Corner radius
446+
447+
The [`CornerRadius`](https://help.syncfusion.com/cr/aspnetmvc-js2/Syncfusion.EJ2.Charts.ChartSeries.html#Syncfusion_EJ2_Charts_ChartSeries_CornerRadius) property in the chart series is used to customize the corner radius for 100% stacked column series. This allows you to create 100% stacked columns with rounded corners, giving your chart a more polished appearance. You can customize each corner of the 100% stacked columns using the topLeft, topRight, bottomLeft, and bottomRight properties.
448+
449+
{% if page.publishingplatform == "aspnet-core" %}
450+
451+
{% tabs %}
452+
{% highlight cshtml tabtitle="CSHTML" %}
453+
{% include code-snippet/chart/series/stacked-column/corner-radius/tagHelper %}
454+
{% endhighlight %}
455+
{% highlight c# tabtitle="Corner-radius.cs" %}
456+
{% include code-snippet/chart/series/stacked-column/corner-radius/corner-radius.cs %}
457+
{% endhighlight %}
458+
{% endtabs %}
459+
460+
{% elsif page.publishingplatform == "aspnet-mvc" %}
461+
462+
{% tabs %}
463+
{% highlight razor tabtitle="CSHTML" %}
464+
{% include code-snippet/chart/series/stacked-column/corner-radius/razor %}
465+
{% endhighlight %}
466+
{% highlight c# tabtitle="Corner-radius.cs" %}
467+
{% include code-snippet/chart/series/stacked-column/corner-radius/corner-radius.cs %}
468+
{% endhighlight %}
469+
{% endtabs %}
470+
{% endif %}
471+
472+
473+
474+
### Point corner radius
475+
476+
We can customize the corner radius for individual points in the chart series using the [`PointRender`](https://help.syncfusion.com/cr/aspnetmvc-js2/Syncfusion.EJ2.Charts.Chart.html#Syncfusion_EJ2_Charts_Chart_PointRender) event by setting the [`CornerRadius`](https://help.syncfusion.com/cr/aspnetmvc-js2/Syncfusion.EJ2.Charts.ChartSeries.html#Syncfusion_EJ2_Charts_ChartSeries_CornerRadius) property in its event argument.
477+
478+
{% if page.publishingplatform == "aspnet-core" %}
479+
480+
{% tabs %}
481+
{% highlight cshtml tabtitle="CSHTML" %}
482+
{% include code-snippet/chart/series/stacked-column/point-corner-radius/tagHelper %}
483+
{% endhighlight %}
484+
{% highlight c# tabtitle="Point-corner-radius.cs" %}
485+
{% include code-snippet/chart/series/stacked-column/point-corner-radius/point-corner-radius.cs %}
486+
{% endhighlight %}
487+
{% endtabs %}
488+
489+
{% elsif page.publishingplatform == "aspnet-mvc" %}
490+
491+
{% tabs %}
492+
{% highlight razor tabtitle="CSHTML" %}
493+
{% include code-snippet/chart/series/stacked-column/point-corner-radius/razor %}
494+
{% endhighlight %}
495+
{% highlight c# tabtitle="Point-corner-radius.cs" %}
496+
{% include code-snippet/chart/series/stacked-column/point-corner-radius/point-corner-radius.cs %}
497+
{% endhighlight %}
498+
{% endtabs %}
499+
{% endif %}
500+
501+
502+
445503
## See also
446504

447505
* [Data Label](../data-labels)

‎ej2-asp-core-mvc/chat-ui/EJ2_ASP.MVC/header.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -153,6 +153,8 @@ You can use the `Tooltip` property to specify the tooltip text to be displayed o
153153
{% endhighlight %}
154154
{% endtabs %}
155155

156+
![TooltipText](images/tooltip-text.png)
157+
156158
#### Setting CSS Class
157159

158160
You can use the `CssClass` property to customize the header toolbar item.

‎ej2-asp-core-mvc/chat-ui/EJ2_ASP.NETCORE/header.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -153,6 +153,8 @@ You can use the `tooltip` property to specify the tooltip text to be displayed o
153153
{% endhighlight %}
154154
{% endtabs %}
155155

156+
![TooltipText](images/tooltip-text.png)
157+
156158
#### Setting CSS Class
157159

158160
You can use the `cssClass` property to customize the header toolbar item.

‎ej2-asp-core-mvc/chat-ui/images/tooltip-text.png

95 KB
Loading

‎ej2-asp-core-mvc/code-snippet/grid/edit/prevent-add-duplicate/customvalidation.cs

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
public IActionResult Index()
2+
{
3+
ViewBag.DataSource = OrdersDetails.GetAllRecords();
4+
return View();
5+
}

‎ej2-asp-core-mvc/code-snippet/grid/edit/prevent-add-duplicate/razor

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
@Html.EJS().Grid("CustomValid").DataSource((IEnumerable<object>)ViewBag.DataSource).Columns(col =>
2+
{
3+
col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).Width("120").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
4+
col.Field("CustomerID").HeaderText("Customer Name").Width("150").ValidationRules(new { required = "true"}).Add();
5+
col.Field("Freight").HeaderText("Freight").Width("120").EditType("numericedit").Format("C2").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
6+
col.Field("ShipName").HeaderText("Ship Name").Width("150").Add();
7+
col.Field("ShipCountry").HeaderText("Ship Country").EditType("dropdownedit").Width("150").Add();
8+
}).EditSettings(edit => { edit.AllowAdding(true).AllowEditing(true).AllowDeleting(true); }).Created("created").ActionBegin("actionBegin").Toolbar(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" }).Render()
9+
<script>
10+
var grid;
11+
var orderIDRules = {
12+
required: true,
13+
min: [orderIdCustomValidation, 'The entered value already exists in the column OrderID. Please enter a unique value.']
14+
};
15+
16+
function created() {
17+
grid = this;
18+
}
19+
20+
function orderIdCustomValidation(args) {
21+
return (grid.dataSource).every((data) => {
22+
return data['OrderID'] + '' !== args['value'] || data['OrderID'] === grid.editModule.editModule.args.rowData['OrderID']
23+
});
24+
};
25+
26+
function actionBegin(args) {
27+
if (args.requestType === 'save') {
28+
grid.editModule.formObj.addRules('OrderID', orderIDRules); // Add form validation rules dynamically.
29+
if (!grid.editModule.formObj.validate()) { // Check dynamically added validation rules.
30+
args.cancel = true; // Prevent adding duplicate data action.
31+
}
32+
grid.editModule.formObj.removeRules('OrderID'); // Remove form validation rules dynamically.
33+
}
34+
}
35+
</script>

‎ej2-asp-core-mvc/code-snippet/grid/edit/prevent-add-duplicate/tagHelper

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<ejs-grid id="Grid" dataSource="@ViewBag.DataSource" height="273" toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })" actionBegin="actionBegin" created="created">
2+
<e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true" mode="Normal"></e-grid-editSettings>
3+
<e-grid-columns>
4+
<e-grid-column field="OrderID" headerText="Order ID" isPrimaryKey="true" textAlign="Right" width="120"></e-grid-column>
5+
<e-grid-column field="CustomerID" headerText="Customer ID" type="string" width="120" validationRules="@(new { required= true })"></e-grid-column>
6+
<e-grid-column field="Freight" headerText="Freight" textAlign="Right" format="C2" editType="numericedit" width="120"></e-grid-column>
7+
<e-grid-column field="ShipName" headerText="Ship Name" width="150"></e-grid-column>
8+
<e-grid-column field="ShipCountry" headerText="Ship Country" width="150"></e-grid-column>
9+
</e-grid-columns>
10+
</ejs-grid>
11+
12+
<script>
13+
var grid;
14+
var orderIDRules = {
15+
required: true,
16+
min: [orderIdCustomValidation, 'The entered value already exists in the column OrderID. Please enter a unique value.']
17+
};
18+
19+
function created() {
20+
grid = this;
21+
}
22+
23+
function orderIdCustomValidation(args) {
24+
return (grid.dataSource).every((data) => {
25+
return data['OrderID'] + '' !== args['value'] || data['OrderID'] === grid.editModule.editModule.args.rowData['OrderID']
26+
});
27+
};
28+
29+
function actionBegin(args) {
30+
if (args.requestType === 'save') {
31+
grid.editModule.formObj.addRules('OrderID', orderIDRules); // Add form validation rules dynamically.
32+
if (!grid.editModule.formObj.validate()) { // Check dynamically added validation rules.
33+
args.cancel = true; // Prevent adding duplicate data action.
34+
}
35+
grid.editModule.formObj.removeRules('OrderID'); // Remove form validation rules dynamically.
36+
}
37+
}
38+
</script>

‎ej2-asp-core-mvc/code-snippet/grid/scrolling/render-scrollbar/razor

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<div id="scroller" style="width: 100%; overflow-x: auto; height: 18px;"></div>
2+
@Html.EJS().Grid("grid").DataSource((IEnumerable<object>)ViewBag.dataSource).Height(315).Width(500).Columns(col =>
3+
{
4+
col.Field("OrderID").HeaderText("Order ID").Width(90).TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
5+
col.Field("CustomerID").HeaderText("Customer ID").Width(100).Add();
6+
col.Field("EmployeeID").HeaderText("Employee ID").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width(80).Add();
7+
col.Field("OrderDate").HeaderText("Order Date").Width(140).Format("yMd").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
8+
col.Field("Freight").HeaderText("Freight").Width(80).Add();
9+
col.Field("ShipName").HeaderText("Ship Name").Width(130).Add();
10+
col.Field("ShipAddress").HeaderText("Ship Address").Width(140).Add();
11+
col.Field("ShipCity").HeaderText("Ship City").Width(100).Add();
12+
col.Field("ShipCountry").HeaderText("Ship Country").Width(100).Add();
13+
col.Field("ShipRegion").HeaderText("Ship Region").Width(80).Add();
14+
col.Field("ShipPostalCode").HeaderText("Ship Postal Code").Width(110).Add();
15+
}).Created("onGridCreated").Render()
16+
</div>
17+
<script>
18+
function onGridCreated() {
19+
var grid = this;
20+
var scroller = document.getElementById('scroller');
21+
var content = grid.getContent().firstElementChild;
22+
var contentTable = grid.getContentTable();
23+
24+
grid.element.insertBefore(scroller, content.parentElement);
25+
26+
scroller.onscroll = function () {
27+
content.scrollLeft = scroller.scrollLeft;
28+
};
29+
content.onscroll = function () {
30+
scroller.scrollLeft = content.scrollLeft;
31+
};
32+
33+
function setScroller() {
34+
if (contentTable) {
35+
scroller.innerHTML = `<div style="width: ${contentTable.offsetWidth}px; height: 18px;"></div>`;
36+
scroller.style.height = content.scrollWidth <= content.clientWidth ? '0px' : '18px';
37+
}
38+
}
39+
40+
setScroller();
41+
window.onresize = setScroller;
42+
}
43+
</script>

‎ej2-asp-core-mvc/code-snippet/grid/scrolling/render-scrollbar/render-scrollbar.cs

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
public IActionResult Index()
2+
{
3+
ViewBag.dataSource = OrderDetails.GetAllRecords();
4+
return View();
5+
}

‎ej2-asp-core-mvc/code-snippet/grid/scrolling/render-scrollbar/tagHelper

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
<div id="scroller" style="width: 100%; overflow-x: auto; height: 18px;"></div>
2+
<ejs-grid id="Grid" dataSource="@ViewBag.dataSource" height="315" width="500" created="created">
3+
<e-grid-columns>
4+
<e-grid-column field="OrderID" headerText="Order ID" textAlign="Right" width="90"></e-grid-column>
5+
<e-grid-column field="CustomerID" headerText="Customer ID" width="100"></e-grid-column>
6+
<e-grid-column field="EmployeeID" headerText="Employee ID" textAlign="Right" width="80"></e-grid-column>
7+
<e-grid-column field="OrderDate" headerText="Order Date" width="140" format="yMd" textAlign="Right"></e-grid-column>
8+
<e-grid-column field="Freight" headerText="Freight" width="80"></e-grid-column>
9+
<e-grid-column field="ShipName" headerText="Ship Name" width="130"></e-grid-column>
10+
<e-grid-column field="ShipAddress" headerText="Ship Address" width="140"></e-grid-column>
11+
<e-grid-column field="ShipCity" headerText="Ship City" width="100"></e-grid-column>
12+
<e-grid-column field="ShipCountry" headerText="Ship Country" width="100"></e-grid-column>
13+
<e-grid-column field="ShipRegion" headerText="Ship Region" width="80"></e-grid-column>
14+
<e-grid-column field="ShipPostalCode" headerText="Ship Postal Code" width="110"></e-grid-column>
15+
</e-grid-columns>
16+
</ejs-grid>
17+
<script>
18+
function created() {
19+
var grid = this;
20+
var scroller = document.getElementById('scroller');
21+
var content = grid.getContent().firstElementChild;
22+
var contentTable = grid.getContentTable();
23+
24+
if (!scroller) return;
25+
26+
scroller.onscroll = function () {
27+
content.scrollLeft = scroller.scrollLeft;
28+
};
29+
content.onscroll = function () {
30+
scroller.scrollLeft = content.scrollLeft;
31+
};
32+
33+
function setScroller() {
34+
if (contentTable) {
35+
scroller.innerHTML = `<div style="width: ${contentTable.offsetWidth}px; height: 18px;"></div>`;
36+
scroller.style.height = content.scrollWidth <= content.clientWidth ? '0px' : '18px';
37+
}
38+
}
39+
setScroller();
40+
window.onresize = setScroller;
41+
}
42+
</script>

0 commit comments

Comments
 (0)