This sample demonstrates the usage of context menu in Grid component. Right click anywhere on the Grid to view context menu.
Order ID | Customer Name | Freight | Ship Name | Ship Country | Ship City |
|---|---|---|---|---|---|
| 10248 | Maria | $32.38 | Vins et alcools Chevalier | France | Reims |
| 10249 | Ana Trujillo | $11.61 | Toms Spezialitäten | Germany | Münster |
| 10250 | Antonio Moreno | $65.83 | Hanari Carnes | Brazil | Rio de Janeiro |
| 10251 | Thomas Hardy | $41.34 | Victuailles en stock | France | Lyon |
| 10252 | Christina Berglund | $51.30 | Suprêmes délices | Belgium | Charleroi |
| 10253 | Hanna Moos | $58.17 | Hanari Carnes | Brazil | Rio de Janeiro |
| 10254 | Frédérique Citeaux | $22.98 | Chop-suey Chinese | Switzerland | Bern |
| 10255 | Martín Sommer | $148.33 | Richter Supermarkt | Switzerland | Genève |
| 10256 | Laurence Lebihan | $13.97 | Wellington Importadora | Brazil | Resende |
| 10257 | Elizabeth Lincoln | $81.91 | HILARION-Abastos | Venezuela | San Cristóbal |
| 10258 | Victoria Ashworth | $140.51 | Ernst Handel | Austria | Graz |
| 10259 | Patricio Simpson | $3.25 | Centro comercial Moctezuma | Mexico | México D.F. |
Grid has options to show the context menu when right click on it. To configure the items in context menu, you should define either default or custom item in contextMenuItems. Each item will be shown based on it target. The default items are Edit - Edit the current record. Delete - Delete the current record. Save - Save the edited record. Cancel - Cancel the edited state. Copy - Copy the selected records. PdfExport - Export the grid as Pdf format. ExcelExport - Export the grid as Excel format. CsvExport - Export the grid as CSV format. SortAscending - Sort the current column in ascending order. SortDescending - Sort the current column in descending order. FirstPage - Go to the first page. PrevPage - Go to the previous page. LastPage - Go to the last page. NextPage - Go to the next page. While using the Grid in a touch device environment, touch and hold the Grid row cell to show the context menu. In this demo, Context Menu feature has enabled by defining the contextMenuItems property with all default items. Injecting Module Grid features are segregated into individual feature-wise modules. To use context menu feature, we need to inject ContextMenu module using the Grid.Inject(ContextMenu) section.