DOCINFRA-2341_merged_using_automation

ej2-asp-core-mvc/code-snippet/grid/columns/resizeevents/resizeevents.cs → ej2-asp-core-mvc/code-snippet/grid/columns/auto-primary/primary.cs

@@ -1,6 +1,6 @@
 public IActionResult Index()
 {
     var Order = OrderDetails.GetAllRecords();
-    ViewBag.DataSource = Order;
+    ViewBag.dataSource = Order;
     return View();
 } 

ej2-asp-core-mvc/code-snippet/grid/columns/primary/razor → ej2-asp-core-mvc/code-snippet/grid/columns/auto-primary/razor

@@ -2,8 +2,6 @@
 
 <script>
     function dataBound() {
-        var grid = document.getElementById('Auto').ej2_instances[0];
-        var column = grid.columns[0];
-        column.isPrimaryKey = 'true';
+        document.getElementById('Auto').ej2_instances[0].columns[0].isPrimaryKey = 'true';
     }
 </script>

ej2-asp-core-mvc/code-snippet/grid/columns/auto-primary/tagHelper

@@ -0,0 +1,10 @@
+<ejs-grid id="Auto" dataSource="@ViewBag.dataSource" dataBound="dataBound">
+    <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true">
+    </e-grid-editSettings>
+</ejs-grid>
+
+<script>
+    function dataBound() {
+        document.getElementById('Auto').ej2_instances[0].columns[0].isPrimaryKey = 'true';
+    }
+</script>

ej2-asp-core-mvc/code-snippet/grid/columns/auto/razor

@@ -1 +1 @@
-@Html.EJS().Grid("Auto").DataSource((IEnumerable<object>)ViewBag.dataSource).Render()
+@Html.EJS().Grid("Auto").AllowPaging(true).DataSource((IEnumerable<object>)ViewBag.DataSource).Render()

ej2-asp-core-mvc/code-snippet/grid/columns/auto/tagHelper

@@ -1,3 +1,2 @@
-<ejs-grid id="Grid" dataSource="@ViewBag.DataSource">
-
+<ejs-grid id="Grid" allowPaging=true dataSource="@ViewBag.DataSource">   
 </ejs-grid>

ej2-asp-core-mvc/code-snippet/grid/columns/autocolumnformat/razor

@@ -1,17 +1,19 @@
-@Html.EJS().Grid("Auto").DataSource((IEnumerable<object>)ViewBag.dataSource).DataBound("dataBound").Render()
-
+@Html.EJS().Grid("Auto").DataSource((IEnumerable<object>)ViewBag.DataSource).DataBound("dataBound").Render()
 <script>
     function dataBound() {
-        for (var i = 0; i < this.columns.length; i++) {
-            this.columns[0].width = 120;
-            if (this.columns[i].field === "OrderDate") {
-                this.columns[i].type = "date";
+        const grid = document.getElementById('Auto').ej2_instances[0];
+        for (const cols of grid.columns) {
+            if (cols.field === 'OrderID') {
+                cols.width = 120;
             }
-            if (this.columns[i].type === "date") {
-                this.columns[i].format = { type: "date", format: "dd/MM/yyyy" };
+            if (cols.field === 'OrderDate') {
+                cols.type = 'date';
+                cols.format = 'yMd';
+            }
+            if (cols.field === 'Freight') {
+                cols.format = 'P2';
             }
-            this.columns[3].format = "P2";
         }
-        this.refreshColumns();
+        grid.refreshColumns();
     }
 </script>

ej2-asp-core-mvc/code-snippet/grid/columns/autocolumnformat/tagHelper

@@ -4,16 +4,19 @@
 
 <script>
     function dataBound() {
-        for (var i = 0; i < this.columns.length; i++) {
-            this.columns[0].width = 120;
-            if (this.columns[i].field === "OrderDate") {
-                this.columns[i].type = "date";
+        const grid = document.getElementById('Auto').ej2_instances[0];
+        for (const cols of grid.columns) {
+            if (cols.field === 'OrderID') {
+                cols.width = 120;
             }
-            if (this.columns[i].type === "date") {
-                this.columns[i].format = { type: "date", format: "dd/MM/yyyy" };
+            if (cols.field === 'OrderDate') {
+                cols.type = 'date';
+                cols.format = 'yMd';
+            }
+            if (cols.field === 'Freight') {
+                cols.format = 'P2';
             }
-            this.columns[3].format = "P2";
         }
-        this.refreshColumns();
+        grid.refreshColumns();
     }
 </script>

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-array/arraytypecolumns.cs

@@ -0,0 +1,6 @@
+public IActionResult Index()
+{
+    var ComplexData = ComplexData.GetAllRecords();
+    ViewBag.DataSource = ComplexData;
+    return View();
+} 

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-array/razor

@@ -0,0 +1,16 @@
+@{
+    var valueAccess = "valueAccessFn";
+}
+
+@Html.EJS().Grid("Grid").DataSource((IEnumerable<object>)ViewBag.DataSource).Height(350).Columns(col =>
+{
+    col.Field("EmployeeID").HeaderText("Employee ID").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("120").Add();
+    col.Field("Name").HeaderText("Full Name").ValueAccessor(valueAccess).Width("150").Add();
+    col.Field("Title").HeaderText("Title").Width("150").Add();
+}).Render()
+
+<script>
+    function valueAccessFn(field, data) {
+        return data[field].map((s) => { return s.LastName || s.FirstName; }).join(' ');
+    }
+</script>

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-array/tagHelper

@@ -0,0 +1,17 @@
+@{
+    var valueAccess = "valueAccessFn";
+}
+
+<ejs-grid id="Grid" dataSource="@ViewBag.DataSource" height="350" >    
+    <e-grid-columns>
+        <e-grid-column field="EmployeeID" headerText="Employee ID" width="150" ></e-grid-column>
+        <e-grid-column field="Name" headerText="Full Name" width="150"></e-grid-column>
+        <e-grid-column field="Title" headerText="Title" width="150"></e-grid-column>
+    </e-grid-columns>
+</ejs-grid>
+
+<script>
+    function valueAccessFn(field, data) {
+        return data[field].map((s) => { return s.LastName || s.FirstName; }).join(' ');
+    }
+</script>

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-expression/expressioncolumn.cs

@@ -0,0 +1,6 @@
+public IActionResult Index()
+{
+    var Order = FoodDetails.GetAllRecords();
+    ViewBag.DataSource = Order;
+    return View();
+} 

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-expression/razor

@@ -0,0 +1,19 @@
+@{ 
+    var totalCalories = "totalCaloriesFn";
+}
+
+@Html.EJS().Grid("ValueAccessor").DataSource((IEnumerable<object>)ViewBag.DataSource).Height(350).Columns(col =>
+{
+    col.Field("FoodName").HeaderText("Food Name").Width("150").Add();
+    col.Field("Protein").HeaderText("Protein").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("120").Add();
+    col.Field("Fat").HeaderText("Fat").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("80").Add();
+    col.Field("Carbohydrate").HeaderText("Carbohydrate").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("120").Add();
+    col.HeaderText("Calories Intake").ValueAccessor(totalCalories).TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("150").Add();
+
+}).Render()
+
+<script>
+    function totalCaloriesFn(field, data) {
+        return data.Protein * 4 + data.Fat * 9 + data.Carbohydrate * 4;
+    }
+</script>

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-expression/tagHelper

@@ -0,0 +1,19 @@
+@{ 
+    var totalCalories = "totalCaloriesFn";
+}
+
+<ejs-grid id="ValueAccessor" dataSource="@ViewBag.DataSource" height="280">
+    <e-grid-columns>
+        <e-grid-column field='FoodName' headerText='Food Name' width=150></e-grid-column>
+        <e-grid-column field='Protein' headerText='Protein' textAlign='Right' width=120></e-grid-column>
+        <e-grid-column field='Fat' headerText='Fat' textAlign='Right' width=80></e-grid-column>
+        <e-grid-column field='Carbohydrate' headerText='Carbohydrate' textAlign='Right' width=120></e-grid-column>
+        <e-grid-column headerText='Calories Intake' textAlign='Right' valueAccessor='totalCalories' width=150></e-grid-column>
+    </e-grid-columns>
+</ejs-grid>
+
+<script>
+    function totalCaloriesFn(field, data) {
+        return data.Protein * 4 + data.Fat * 9 + data.Carbohydrate * 4;
+    }
+</script>

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-remote/razor

@@ -0,0 +1,12 @@
+@Html.EJS().Grid("Grid").DataSource(dataManger =>
+{
+    dataManger.Url("https://services.odata.org/V4/Northwind/Northwind.svc/Orders/").CrossDomain(true).Adaptor("ODataV4Adaptor");
+
+}).Query("new ej.data.Query().expand('Employee')").Columns(col =>
+{
+    col.Field("OrderID").HeaderText("Order ID").Width("100").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
+    col.Field("CustomerID").HeaderText("Customer Name").Width("120").Add();
+     col.Field("ShipCity").HeaderText("Ship City").Width("130").Add();
+    col.Field("Employee.City").HeaderText("City").Width("130").Add();
+
+}).AllowPaging().Render()

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-remote/tagHelper

@@ -0,0 +1,10 @@
+<ejs-grid id="Grid" allowPaging='true' query="new ej.data.Query().expand('Employee')"  >    
+  <e-data-manager url="https://services.odata.org/V4/Northwind/Northwind.svc/Orders/" crossdomain="true" adaptor="ODataV4Adaptor"></e-data-manager>
+    <e-grid-columns>
+        <e-grid-column field="OrderID" headerText="Order ID" width="100" ></e-grid-column>
+        <e-grid-column field="CustomerID" headerText="Customer ID"  width="120"></e-grid-column>
+        <e-grid-column field="ShipCity" headerText="Ship City"  width="130"></e-grid-column>
+        <e-grid-column field="Employee.City" headerText="City"  width="130"></e-grid-column>
+    </e-grid-columns>
+</ejs-grid>
+

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-serial/razor

@@ -0,0 +1,23 @@
+@Html.EJS().Grid("Grid").DataSource((IEnumerable<object>)ViewBag.dataSource).Height(350).Columns(col =>
+{
+    col.HeaderText("S.No").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Center).Width("90").Add();
+    col.Field("OrderID").HeaderText("Order ID").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("120").Add();
+    col.Field("CustomerID").HeaderText("Customer Name").Width("150").Add();
+    col.Field("Freight").HeaderText("Freight").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("120").Add();
+    col.Field("ShipCity").HeaderText("Ship City").Width("150").Add();
+}).AllowPaging().RowDataBound("rowDataBound").Render()
+</div>
+<script>
+    function rowDataBound(args) {
+        let grid = document.getElementById('Grid').ej2_instances[0];
+        if (args.row) {
+            var rowIndex = parseInt(args.row.getAttribute('aria-rowIndex'));
+            var currentPageNumber = grid.pageSettings.currentPage;
+            var pageSize = grid.pageSettings.pageSize;
+            var startIndex = (currentPageNumber - 1) * pageSize;
+            args.row.querySelector('.e-rowcell').innerHTML = (
+                startIndex + rowIndex
+            ).toString();
+        }
+    }
+</script>

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-serial/serialnumber.cs

@@ -0,0 +1,6 @@
+public IActionResult Index()
+{
+    var Order = OrdersDetails.GetAllRecords();
+    ViewBag.dataSource = Order;
+    return View();
+} 

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-serial/tagHelper

@@ -0,0 +1,23 @@
+<ejs-grid id="Grid" dataSource="@ViewBag.dataSource" height="350" rowDataBound='rowDataBound' allowPaging="true">
+    <e-grid-columns>
+        <e-grid-column headerText='S.No' width=90 textAlign='Center'></e-grid-column>
+        <e-grid-column field="OrderID" headerText="Order ID" width="100" textAlign="Right"></e-grid-column>
+        <e-grid-column field="CustomerID" headerText="Customer Name" width="120"></e-grid-column>
+        <e-grid-column field="Freight" headerText="Freight" textAlign="Right" width="120" ></e-grid-column>
+        <e-grid-column field="ShipCity"  headerText="Ship City" width="150"></e-grid-column>
+    </e-grid-columns>
+</ejs-grid>
+<script>
+    function rowDataBound (args) {
+        let grid = document.getElementById('Grid').ej2_instances[0];
+        if (args.row) {
+            var rowIndex = parseInt(args.row.getAttribute('aria-rowIndex'));
+            var currentPageNumber = grid.pageSettings.currentPage;
+            var pageSize = grid.pageSettings.pageSize;
+            var startIndex = (currentPageNumber - 1) * pageSize;
+            args.row.querySelector('.e-rowcell').innerHTML = (
+                startIndex + rowIndex
+            ).toString();
+        }
+    }
+</script>

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-valueaccessor/razor

@@ -0,0 +1,21 @@
+@{ 
+    var currencyFormatter = "currencyFormatterFn";
+    var concatenateFields = "concatenateFieldsFn";
+}
+
+@Html.EJS().Grid("ValueAccessor").DataSource((IEnumerable<object>)ViewBag.DataSource).Height(350).Columns(col =>
+{
+    col.Field("OrderID").HeaderText("Order ID").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("120").Add();
+    col.Field("CustomerID").HeaderText("Customer Name").Width("150").Add();
+    col.Field("Freight").HeaderText("Freight").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("120").ValueAccessor(currencyFormatter).Add();
+    col.Field("ShipCity").HeaderText("Ship City").ValueAccessor(concatenateFields).Width("150").Add();
+}).Render()
+
+<script>
+    function currencyFormatterFn(field, data) {
+        return '€' + data['Freight']
+    }
+    function concatenateFieldsFn(field, data) {
+        return data['ShipCity'] + '-' + data['ShipRegion'];
+    }
+</script>

ej2-asp-core-mvc/code-snippet/grid/columns/column-render-valueaccessor/tagHelper

@@ -0,0 +1,23 @@
+@{ 
+    var currencyFormatter = "currencyFormatterFn";
+    var concatenateFields = "concatenateFieldsFn";
+}
+
+<ejs-grid id="ValueAccessor" dataSource="@ViewBag.DataSource" height="350">
+    <e-grid-columns>
+        <e-grid-column field="OrderID" headerText="Order ID" width="100" textAlign="Right"></e-grid-column>
+        <e-grid-column field="CustomerID" headerText="Customer Name" width="120"></e-grid-column>
+        <e-grid-column field="Freight" headerText="Freight" textAlign="Right"  width="120"  valueAccessor="currencyFormatter" ></e-grid-column>                               
+        <e-grid-column field="ShipCity" valueAccessor="concatenateFields" headerText="Ship City" width="150"></e-grid-column> 
+    </e-grid-columns>
+</ejs-grid>
+
+<script>
+    function currencyFormatterFn(field, data) {
+        return '€' + data['Freight']
+    }
+
+    function concatenateFieldsFn(field, data) {
+        return data['ShipCity'] + '-' + data['ShipRegion']; // Assuming concatenation of ShipCity and ShipCountry
+    }
+</script>

ej2-asp-core-mvc/code-snippet/grid/columns/valueaccessor/valueaccessor.cs → ej2-asp-core-mvc/code-snippet/grid/columns/column-render-valueaccessor/valueaccessor.cs

@@ -1,6 +1,6 @@
 public IActionResult Index()
 {
-    var Order = OrderDetails.GetAllRecords();
+    var Order = OrdersDetails.GetAllRecords();
     ViewBag.DataSource = Order;
     return View();
 } 

ej2-asp-core-mvc/code-snippet/grid/columns/column-rendering/razor

@@ -0,0 +1,9 @@
+@Html.EJS().Grid("Grid").DataSource((IEnumerable<object>)ViewBag.DataSource).Columns(col =>
+{
+    col.Field("OrderID").HeaderText("Order ID").Width("100").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
+    col.Field("CustomerID").HeaderText("Customer ID").Width("120").Add();
+    col.Field("Freight").HeaderText("Freight").Width("80").Format("C2").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
+    col.Field("OrderDate").HeaderText("Order Date").Width("80").Format("yMd").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
+    col.Field("ShipCity").HeaderText("Ship Country").Width("120").Add();
+
+}).Render()

ej2-asp-core-mvc/code-snippet/grid/columns/column-rendering/tagHelper

@@ -0,0 +1,8 @@
+<ejs-grid id="Grid" dataSource="@ViewBag.DataSource" height='315'>
+    <e-grid-columns>
+        <e-grid-column field='OrderID' headerText='Order ID' textAlign='Right' width="100"></e-grid-column>
+        <e-grid-column field='CustomerID' headerText='Customer ID' width="120"></e-grid-column>
+        <e-grid-column field='Freight' headerText='Freight' format='C2' textAlign='Right' width="80"></e-grid-column>
+        <e-grid-column field='OrderDate' headerText='Order Date' format='yMd' textAlign='Right' width="80"></e-grid-column>
+    </e-grid-columns>
+</ejs-grid>

ej2-asp-core-mvc/code-snippet/grid/columns/columnchooser-contains/columnchooser.cs

@@ -0,0 +1,6 @@
+public IActionResult Index()
+{
+    var Order = OrdersDetails.GetAllRecords();
+    ViewBag.DataSource = Order;
+    return View();
+} 

ej2-asp-core-mvc/code-snippet/grid/columns/columnchooser-contains/razor

@@ -0,0 +1,8 @@
+@Html.EJS().Grid("Grid").DataSource((IEnumerable<object>)ViewBag.DataSource).ShowColumnChooser(true).Columns(col =>
+{
+    col.Field("OrderID").HeaderText("Order ID").Width("120").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
+    col.Field("CustomerID").HeaderText("Customer ID").Width("130").Add();
+    col.Field("Freight").HeaderText("Freight").Width("120").Format("C").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
+    col.Field("OrderDate").HeaderText("Order Date").Width("130").Format("yMd").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
+    col.Field("ShipCountry").HeaderText("Ship Country").Width("120").Add();
+}).Toolbar(new List<string>() { "ColumnChooser" }).ColumnChooserSettings(choose=> { choose.Operator("Contains"); }).Render()

ej2-asp-core-mvc/code-snippet/grid/columns/columnchooser-contains/tagHelper

@@ -0,0 +1,10 @@
+<ejs-grid id="Grid" dataSource="@ViewBag.DataSource" showColumnChooser='true' toolbar="@(new List<string>() { "ColumnChooser"})">
+    <e-grid-columnChooserSettings operator='contains'></e-grid-columnChooserSettings>
+    <e-grid-columns>
+        <e-grid-column field='OrderID' headerText='Order ID' textAlign='Right' width=120></e-grid-column>
+        <e-grid-column field="CustomerID" headerText="Customer ID"  width="130"></e-grid-column>
+        <e-grid-column field="Freight" headerText="Freight" format='C' textAlign="Right" width="120"></e-grid-column>
+        <e-grid-column field="OrderDate" headerText="Order Date"  textAlign="Right" type='date' format="yMd" width="130"></e-grid-column>
+        <e-grid-column field="ShipCountry" headerText="Ship Country" width="120"></e-grid-column>
+    </e-grid-columns>
+</ejs-grid>

ej2-asp-core-mvc/code-snippet/grid/columns/columnchooser-diacritics/columnchooser.cs

@@ -0,0 +1,6 @@
+public IActionResult Index()
+{
+    var Order = OrdersDetails.GetAllRecords();
+    ViewBag.DataSource = Order;
+    return View();
+} 

ej2-asp-core-mvc/code-snippet/grid/columns/columnchooser-diacritics/razor

@@ -0,0 +1,8 @@
+@Html.EJS().Grid("Grid").DataSource((IEnumerable<object>)ViewBag.DataSource).ShowColumnChooser(true).Columns(col =>
+{
+    col.Field("ÒrderID̂").HeaderText("Òrder ID̂").Width("120").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
+    col.Field("CustomerID").HeaderText("Customer ID").Width("130").Add();
+    col.Field("F̂reight").HeaderText("F̂reight").Width("120").Format("C").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
+    col.Field("OrderDate").HeaderText("Order Date").Width("130").Format("yMd").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
+    col.Field("ShipCountry").HeaderText("Ship Country").Width("120").Add();
+}).Toolbar(new List<string>() { "ColumnChooser" }).ColumnChooserSettings(choose => { choose.IgnoreAccent(true); }).Render()