Skip to content

Commit c22fbe6

Browse files
farveensulthanafarveensulthana
authored
Merge pull request #4110 from syncfusion-content/384809-new
documentation(384809):New topics aspcore and mvc platform.
2 parents 6c53659 + b853223 commit c22fbe6

File tree

40 files changed

+1071
-2
lines changed

40 files changed

+1071
-2
lines changed

‎ej2-asp-core-mvc/code-snippet/grid/columns/frozen-datepicker/frozen.cs

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

‎ej2-asp-core-mvc/code-snippet/grid/columns/frozen-datepicker/razor

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
@Html.EJS().Grid("Grid").DataSource((IEnumerable<object>)ViewBag.dataSource).FrozenColumns(2).Columns(col =>
2+
{
3+
col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).Width("120").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
4+
col.Field("OrderDate").HeaderText("Order Date").Width("130").Format("yMd").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Edit(new { create = "createDatePicker", read = "readDatePicker", destroy = "destroyDatePicker", write = "writeDatePicker" }).Add();
5+
col.Field("CustomerID").HeaderText("Customer ID").Width("130").Add();
6+
col.Field("ShipCity").HeaderText("Ship City").Width("120").Add();
7+
}).AllowPaging().PageSettings(page=>page.PageCount(5)).EditSettings(edit => { edit.AllowAdding(true).AllowEditing(true).AllowDeleting(true); }).Toolbar(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" }).Render()
8+
<script>
9+
var datePickerObj;
10+
var datePickerElement;
11+
function createDatePicker() {
12+
datePickerElement = document.createElement('input');
13+
return datePickerElement;
14+
}
15+
function readDatePicker() {
16+
return datePickerObj.value;
17+
}
18+
function destroyDatePicker() {
19+
datePickerObj.destroy();
20+
}
21+
function writeDatePicker(args) {
22+
var rowData = args.rowData;
23+
datePickerObj = new ej.calendars.DatePicker({
24+
value: rowData.OrderDate,
25+
change: function (e) {
26+
rowData.OrderDate = e.value;
27+
}
28+
});
29+
datePickerObj.appendTo(datePickerElement);
30+
}
31+
</script>

‎ej2-asp-core-mvc/code-snippet/grid/columns/frozen-datepicker/tagHelper

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<ejs-grid id="Grid" dataSource="@ViewBag.dataSource" allowPaging='true' toolbar="@(new List<string>() { "Add", "Edit", "Delete","Update","Cancel" })" frozenColumns='2'>
2+
<e-grid-pagesettings pageCount="5"></e-grid-pagesettings>
3+
<e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true"></e-grid-editSettings>
4+
<e-grid-columns>
5+
<e-grid-column field="OrderID" headerText="Order ID" isPrimaryKey="true" textAlign="Right" width="120"></e-grid-column>
6+
<e-grid-column field="OrderDate" headerText="Order Date" width="150" format= "yMd", edit="@(new {create = "createDatePicker", read = "readDatePicker", destroy = "destroyDatePicker", write = "writeDatePicker"})">
7+
</e-grid-column>
8+
<e-grid-column field="CustomerID" headerText="CustomerID" width="120"></e-grid-column>
9+
<e-grid-column field="ShipCity" headerText="Ship City" width="150"></e-grid-column>
10+
</e-grid-columns>
11+
</ejs-grid>
12+
<script>
13+
var datePickerObj;
14+
var datePickerElement;
15+
function createDatePicker() {
16+
datePickerElement = document.createElement('input');
17+
return datePickerElement;
18+
}
19+
function readDatePicker() {
20+
return datePickerObj.value;
21+
}
22+
function destroyDatePicker() {
23+
datePickerObj.destroy();
24+
}
25+
function writeDatePicker(args) {
26+
var rowData = args.rowData;
27+
datePickerObj = new ej.calendars.DatePicker({
28+
value: rowData.OrderDate,
29+
change: function (e) {
30+
rowData.OrderDate = e.value;
31+
}
32+
});
33+
datePickerObj.appendTo(datePickerElement);
34+
}
35+
</script>

‎ej2-asp-core-mvc/code-snippet/grid/data-binding/custom-headers/custom-headers.cs

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

‎ej2-asp-core-mvc/code-snippet/grid/data-binding/custom-headers/razor

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
@Html.EJS().Grid("CustomAdaptor").Columns(col =>
2+
{
3+
col.Field("OrderID").HeaderText("Order ID").Width("100").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
4+
col.Field("CustomerID").HeaderText("Customer ID").Width("160").Add();
5+
col.Field("EmployeeID").HeaderText("Employee ID").Width("100").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
6+
col.Field("Freight").HeaderText("Freight").Width("150").Format("C2").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
7+
col.Field("ShipCountry").HeaderText("Ship Country").Width("150").Add();
8+
9+
}).AllowPaging().Created("created").Render()
10+
11+
<script>
12+
function created(args) {
13+
class CustomAdaptor extends ej.data.WebApiAdaptor {
14+
beforeSend(args, xhr, settings) {
15+
xhr.withCredentials = true;
16+
super.beforeSend(args, xhr, settings);
17+
xhr.headers.set('Syncfusion', true); // Assign custom headers here.
18+
}
19+
}
20+
var grid = document.querySelector('#CustomAdaptor').ej2_instances[0];
21+
grid.dataSource = new ej.data.DataManager({
22+
url: "https://services.syncfusion.com/js/production/api/orders",
23+
adaptor: new CustomAdaptor()
24+
});
25+
}
26+
</script>

‎ej2-asp-core-mvc/code-snippet/grid/data-binding/custom-headers/tagHelper

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<ejs-grid id="CustomAdaptor" allowPaging="true" created="created">
2+
<e-grid-columns>
3+
<e-grid-column field="OrderID" headerText="Order Name" width="150" textAlign="Right"></e-grid-column>
4+
<e-grid-column field="CustomerID" headerText="Customer Name" width="150"></e-grid-column>
5+
<e-grid-column field="EmployeeID" headerText="Employee Name" width="150" textAlign="Right"></e-grid-column>
6+
<e-grid-column field="Freight" headerText="Freight" format="C2" width="120" textAlign="Right"></e-grid-column>
7+
<e-grid-column field="ShipCountry" headerText="Ship Country" width="150"></e-grid-column>
8+
</e-grid-columns>
9+
</ejs-grid>
10+
11+
<script>
12+
function created(args) {
13+
class CustomAdaptor extends ej.data.WebApiAdaptor {
14+
beforeSend(args, xhr, settings) {
15+
xhr.withCredentials = true;
16+
super.beforeSend(args, xhr, settings);
17+
xhr.headers.set('Syncfusion', true); // Assign custom headers here.
18+
}
19+
}
20+
var grid = document.querySelector('#CustomAdaptor').ej2_instances[0];
21+
grid.dataSource = new ej.data.DataManager({
22+
url: "https://services.syncfusion.com/js/production/api/orders",
23+
adaptor: new CustomAdaptor()
24+
});
25+
}
26+
</script>

‎ej2-asp-core-mvc/code-snippet/grid/excel-export/excelexport-format/excel-export.cs

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

‎ej2-asp-core-mvc/code-snippet/grid/excel-export/excelexport-format/razor

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
@{
2+
var ChildGrid = new Syncfusion.EJ2.Grids.Grid() { DataSource = (IEnumerable<object>)ViewBag.dataSource,
3+
QueryString = "EmployeeID",
4+
Columns = new List<Syncfusion.EJ2.Grids.GridColumn>
5+
{
6+
new Syncfusion.EJ2.Grids.GridColumn(){ Field="OrderID", HeaderText="Order ID", Width="120",TextAlign=Syncfusion.EJ2.Grids.TextAlign.Right },
7+
new Syncfusion.EJ2.Grids.GridColumn(){ Field="Freight", HeaderText="Freight", Width="120", Format="C2", TextAlign=Syncfusion.EJ2.Grids.TextAlign.Right },
8+
new Syncfusion.EJ2.Grids.GridColumn(){ Field="OrderDate", HeaderText="Order Date", Width="150", Format="dd-MM-yyyy", Type="date" },
9+
new Syncfusion.EJ2.Grids.GridColumn(){ Field="ShipCity", HeaderText="Ship City", Width="120" },
10+
}
11+
};
12+
}
13+
@Html.EJS().Grid("Grid").DataSource((IEnumerable<object>)ViewBag.employeeDataSource).Height("348px").AllowExcelExport().Columns(col =>
14+
{
15+
col.Field("EmployeeID").HeaderText("Employee ID").Width("125").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add();
16+
col.Field("FirstName").HeaderText("First Name").Width("125").Add();
17+
col.Field("LastName").HeaderText("Last Name").Width("180").Add();
18+
col.Field("City").HeaderText("City").Width("135").Add();
19+
}).Toolbar(new List<string>() { "ExcelExport"}).ChildGrid(ChildGrid).ToolbarClick("toolbarClick").ExportDetailDataBound("exportDetailDataBound").Render()
20+
<script>
21+
function toolbarClick(args) {
22+
var grid = document.getElementById("Grid").ej2_instances[0];
23+
if (args.item.id === 'Grid_excelexport') {
24+
var excelExportProperties = {
25+
hierarchyExportMode: "All"
26+
};
27+
grid.excelExport(excelExportProperties);
28+
}
29+
}
30+
function exportDetailDataBound(args) {
31+
args.childGrid.columns[2].format = {type: 'date',format: 'dd\\/MM\\/yyyy'};
32+
}
33+
</script>

‎ej2-asp-core-mvc/code-snippet/grid/excel-export/excelexport-format/tagHelper

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
@{ var ChildGrid = new Syncfusion.EJ2.Grids.Grid() {
2+
DataSource = (IEnumerable<object>)ViewBag.DataSource,
3+
QueryString = "EmployeeID",
4+
Columns = new List<Syncfusion.EJ2.Grids.GridColumn> {
5+
new Syncfusion.EJ2.Grids.GridColumn(){ Field="OrderID", HeaderText="Order ID", TextAlign=Syncfusion.EJ2.Grids.TextAlign.Right, Width="120" },
6+
new Syncfusion.EJ2.Grids.GridColumn(){ Field="Freight", HeaderText="Freight", Width="120", Format="C2", TextAlign=Syncfusion.EJ2.Grids.TextAlign.Right },
7+
new Syncfusion.EJ2.Grids.GridColumn(){ Field="OrderDate", HeaderText="OrderDate", Width="130", Format="dd-MM-yyyy", Type="date" },
8+
new Syncfusion.EJ2.Grids.GridColumn(){ Field="ShipCity", HeaderText="Ship City", Width="120" },
9+
}
10+
};
11+
}
12+
<ejs-grid id="Grid" dataSource="@ViewBag.employeeDataSource" allowExcelExport="true" childGrid="ChildGrid" toolbar="@(new List<string>() {"ExcelExport" })" toolbarClick="toolbarClick" exportDetailDataBound="exportDetailDataBound">
13+
<e-grid-columns>
14+
<e-grid-column field="EmployeeID" headerText="Employee ID" textAlign="Right" width="125"></e-grid-column>
15+
<e-grid-column field="FirstName" headerText="First Name" width="120"></e-grid-column>
16+
<e-grid-column field="LastName" headerText="Last Name" width="170"></e-grid-column>
17+
<e-grid-column field="City" headerText="City" width="135"></e-grid-column>
18+
</e-grid-columns>
19+
</ejs-grid>
20+
<script>
21+
function toolbarClick(args) {
22+
var grid = document.getElementById("Grid").ej2_instances[0];
23+
if (args.item.id === 'Grid_excelexport') {
24+
var excelExportProperties = {
25+
hierarchyExportMode: "All"
26+
};
27+
grid.excelExport(excelExportProperties);
28+
}
29+
}
30+
function exportDetailDataBound(args) {
31+
args.childGrid.columns[2].format = {type: 'date',format: 'dd\\/MM\\/yyyy'};
32+
}
33+
</script>

‎ej2-asp-core-mvc/code-snippet/grid/globalization/two-localization/localization.cs

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

‎ej2-asp-core-mvc/code-snippet/grid/globalization/two-localization/razor

Lines changed: 169 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,169 @@
1+
@Html.EJS().Grid("deGrid").DataSource((IEnumerable<object>)ViewBag.datasource).Columns(col =>{
2+
col.Field("OrderID").HeaderText("Order ID").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("120").Add();
3+
col.Field("CustomerID").HeaderText("Customer Name").Width("150").Add();
4+
col.Field("ShipName").HeaderText("Ship Name").Width("150").Add();
5+
col.Field("ShipCountry").HeaderText("Ship Country").Width("150").Add();
6+
}).AllowPaging().Locale("fr-FR").Render();
7+
@Html.EJS().Grid("enGrid").DataSource((IEnumerable<object>)ViewBag.datasource).Columns(col =>{
8+
col.Field("OrderID").HeaderText("Order ID").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("120").Add();
9+
col.Field("CustomerID").HeaderText("Customer Name").Width("150").Add();
10+
col.Field("ShipName").HeaderText("Ship Name").Width("150").Add();
11+
col.Field("ShipCountry").HeaderText("Ship Country").Width("150").Add();
12+
}).AllowPaging().Render()
13+
<script>
14+
ej.base.L10n.load({
15+
'fr-FR': {
16+
'grid': {
17+
"EmptyRecord": "Aucun enregistrement à afficher",
18+
"True": "vrai",
19+
"False": "faux",
20+
"InvalidFilterMessage": "Données de filtre non valides",
21+
"GroupDropArea": "Faites glisser un en-tête de colonne ici pour regrouper sa colonne",
22+
"UnGroup": "Cliquez ici pour dissocier",
23+
"GroupDisable": "Le regroupement est désactivé pour cette colonne",
24+
"FilterbarTitle": "Cellule de barre de filtre \"s",
25+
"EmptyDataSourceError": "DataSource ne doit pas être vide lors du chargement initial car les colonnes sont générées à partir de dataSource dans AutoGenerate Column Grid",
26+
"Add": "Ajouter",
27+
"Edit": "Éditer",
28+
"Cancel": "Annuler",
29+
"Update": "Mise à jour",
30+
"Delete": "Supprimer",
31+
"Print": "Impression",
32+
"Pdfexport": "Exportation PDF",
33+
"Excelexport": "Exportation Excel",
34+
"Wordexport": "Exportation de mots",
35+
"Csvexport": "Exportation CSV",
36+
"Search": "Chercher",
37+
"Columnchooser": "Colonnes",
38+
"Save": "sauvegarder",
39+
"Item": "article",
40+
"Items": "articles",
41+
"EditOperationAlert": "Aucun enregistrement sélectionné pour l'opération d'édition",
42+
"DeleteOperationAlert": "Aucun enregistrement sélectionné pour l'opération de suppression",
43+
"SaveButton": "Sauvegarder",
44+
"OKButton": "Ok",
45+
"CancelButton": "Annuler",
46+
"EditFormTitle": "Les détails de",
47+
"AddFormTitle": "Ajouter un nouvel enregistrement",
48+
"BatchSaveConfirm": "Voulez-vous vraiment enregistrer les modifications ?",
49+
"BatchSaveLostChanges": "Les modifications non enregistrées seront perdues. Es-tu sur de vouloir continuer ?",
50+
"ConfirmDelete": "Voulez-vous vraiment supprimer l'enregistrement ?",
51+
"CancelEdit": "Voulez-vous vraiment annuler les modifications ?",
52+
"ChooseColumns": "Choisissez la colonne",
53+
"SearchColumns": "colonnes de recherche",
54+
"Matchs": "Aucun résultat",
55+
"FilterButton": "Filtrer",
56+
"ClearButton": "Effacer",
57+
"StartsWith": "Commence par",
58+
"EndsWith": "Se termine par",
59+
"Contains": "Contient",
60+
"Equal": "Égal",
61+
"NotEqual": "Différent",
62+
"LessThan": "Inférieur",
63+
"LessThanOrEqual": "Inférieur ou égal",
64+
"GreaterThan": "Supérieur",
65+
"GreaterThanOrEqual": "Supérieur ou égal",
66+
"ChooseDate": "Choisissez une date",
67+
"EnterValue": "Entrez la valeur",
68+
"Copy": "Copie",
69+
"Group": "Regrouper par cette colonne",
70+
"Ungroup": "Dissocier par cette colonne",
71+
"autoFitAll": "Ajuster automatiquement toutes les colonnes",
72+
"autoFit": "Ajuster automatiquement cette colonne",
73+
"Export": "Exportation",
74+
"FirstPage": "Première page",
75+
"LastPage": "Dernière page",
76+
"PreviousPage": "Page précédente",
77+
"NextPage": "Page suivante",
78+
"SortAscending": "Trier par ordre croissant",
79+
"SortDescending": "Trier par ordre décroissant",
80+
"EditRecord": "Modifier l'enregistrement",
81+
"DeleteRecord": "Supprimer l'enregistrement",
82+
"FilterMenu": "Filtre",
83+
"SelectAll": "Tout sélectionner",
84+
"Blanks": "Blancs",
85+
"FilterTrue": "Vrai",
86+
"FilterFalse": "Faux",
87+
"NoResult": "Aucun résultat",
88+
"ClearFilter": "Effacer le filtre",
89+
"NumberFilter": "Filtres numériques",
90+
"TextFilter": "Filtres de texte",
91+
"DateFilter": "Filtres de date",
92+
"DateTimeFilter": "Filtres DateTime",
93+
"MatchCase": "Cas de correspondance",
94+
"Between": "Entre",
95+
"CustomFilter": "Filtre personnalisé",
96+
"CustomFilterPlaceHolder": "Entrez la valeur",
97+
"CustomFilterDatePlaceHolder": "Choisissez une date",
98+
"AND": "ET",
99+
"OR": "OU",
100+
"ShowRowsWhere": "Afficher les lignes où:",
101+
"NotStartsWith": "Ne commence pas par",
102+
"Like": "Comme",
103+
"NotEndsWith": "Ne se termine pas par",
104+
"NotContains": "Ne contient pas",
105+
"IsNull": "Nul",
106+
"NotNull": "Non nul",
107+
"IsEmpty": "Vide",
108+
"IsNotEmpty": "Pas vide",
109+
"AddCurrentSelection": "Ajouter la sélection actuelle au filtre",
110+
"UnGroupButton": "Cliquez ici pour dissocier",
111+
"AutoFitAll": "Ajuster automatiquement toutes les colonnes",
112+
"AutoFit": "Ajuster automatiquement cette colonne",
113+
"Clear": "Dégager",
114+
"FilterMenuDialogARIA": "Boîte de dialogue du menu Filtre",
115+
"ExcelFilterDialogARIA": "Boîte de dialogue de filtre Excel",
116+
"DialogEditARIA": "Boîte de dialogue Modifier",
117+
"ColumnChooserDialogARIA": "Sélecteur de colonne",
118+
"ColumnMenuDialogARIA": "Boîte de dialogue du menu des colonnes",
119+
"CustomFilterDialogARIA": "Boîte de dialogue Filtre personnalisé",
120+
"SortAtoZ": "Trier de A à Z",
121+
"SortZtoA": "Trier de Z à A",
122+
"SortByOldest": "Trier par le plus ancien",
123+
"SortByNewest": "Trier par Plus récent",
124+
"SortSmallestToLargest": "Trier du plus petit au plus grand",
125+
"SortLargestToSmallest": "Trier du plus grand au plus petit",
126+
"Sort": "Sorte",
127+
"FilterDescription": "Appuyez sur Alt Bas pour ouvrir le menu du filtre",
128+
"SortDescription": "Appuyez sur Entrée pour trier",
129+
"ColumnMenuDescription": "Appuyez sur Alt Bas pour ouvrir le menu des colonnes",
130+
"GroupDescription": "Appuyez sur Ctrl espace pour grouper",
131+
"ColumnHeader": " en-tête de colonne ",
132+
"TemplateCell": " est une cellule modèle",
133+
"CommandColumnAria": "est l'en-tête de colonne de la colonne de commande ",
134+
"DialogEdit": "Modifier la boîte de dialogue",
135+
"ClipBoard": "presse-papiers",
136+
"GroupButton": "Bouton de groupe",
137+
"UnGroupAria": "bouton dissocier",
138+
"GroupSeperator": "Séparateur pour les colonnes groupées",
139+
"UnGroupIcon": "dissocier la colonne groupée ",
140+
"GroupedSortIcon": "trier la colonne groupée ",
141+
"GroupedDrag": "Faites glisser la colonne groupée",
142+
"GroupCaption": " est une cellule de légende de groupe",
143+
"CheckBoxLabel": "case à cocher",
144+
"Expanded": "Étendue",
145+
"Collapsed": "S'est effondré"
146+
},
147+
'pager': {
148+
"currentPageInfo": "{0} de {1} pages",
149+
"totalItemsInfo": "({0} éléments)",
150+
"firstPageTooltip": "Aller à la première page",
151+
"lastPageTooltip": "Aller à la dernière page",
152+
"nextPageTooltip": "Aller à la page suivante",
153+
"previousPageTooltip": "Aller à la page précédente",
154+
"nextPagerTooltip": "Aller aux éléments suivants du téléavertisseur",
155+
"previousPagerTooltip": "Accéder aux éléments de téléavertisseur précédents",
156+
"pagerDropDown": "objets par page",
157+
"pagerAllDropDown": "Articles",
158+
"All": "Tout",
159+
"totalItemInfo": "({0} élément)",
160+
"Container": "Conteneur de téléavertisseur",
161+
"Information": "Informations sur le téléavertisseur",
162+
"ExternalMsg": "Message externe du téléavertisseur",
163+
"Page": "Page",
164+
"Of": " de ",
165+
"Pages": " pages"
166+
}
167+
}
168+
});
169+
</script>

0 commit comments

Comments
 (0)