|
RadControls version
|
Q1 2013 SP2 (2013.1.417) and later
|
| .NET version |
4.0 and later
|
| Visual Studio version |
2010 and later
|
| programming language |
C#, VB.NET
|
| browser support |
all browsers supported by RadControls
|
- PROJECT DESCRIPTION
The sample project demonstrates an Excel-like RadGrid. This resembles entering data in an excel spreadsheet - once you double click on a cell, you can enter data in it, without having to invoke the edit command in the standard way. If you scroll down and press the down arrow or enter keys, new items will be added to the control, which will also be in edit mode (inline edit mode).
The control includes an Save in DataBase link in the CommandItem, which will call the ItemCommand event handler that will call the appropriate method which will handle the update to the database. Also the project illustrates the usage of row-context menu which gives the ability to insert an item before the current item, insert after the current item, delete the item, save the changes in the temporary data source, synch the changes to database, and discard the changes made so far. Additionally, there is support for sorting and filtering the Grid. The Grid could be filtered with the built-in filtering control and with a RadComboBox control which allows multiple selections of the distinct values from the column. It allows 5 column types to be used - GridBoundColumn, GridDropDownColumn, GridNumericColumn, GridMaskedColumn, and GridDateTimeColumn. Keyboard navigation is enabled for the GridDateTime column editors, thus you may display the picker control and navigate solely with the keyboard. However, please note that the keyboard navigation of the picker works only when you focus the date input with the keyboard. Otherwise the focus will be put on the Grid and you will need to manually focus the picker. Almost any column editor allows the editing process to be performed without the usage of the mouse.
Possible actions which users can perform:
Mouse actions
Single mouse click on a cell:
Marks the cell as selected (single click selection mode).
Double mouse click on a cell:
Marks the cell as selected in edit mode(double click selection mode). In this mode the user can edit the text into the cell.
Keyboard navigation
Left Arrow key is pressed:
- If the cell is in single click selection mode: Selects the left cell.
- If the cell is in double click selection mode: Moves the caret one position left.
- If this is the left most cell and EnableCircularNavigation property is set to true, the cursor will be moved the above row and the right most column, unless this is the left most column of the first row.
Right Arrow key is pressed:
- If the cell is in single click selection mode: Selects the right cell.
- If the cell is in double click selection mode: Moves the caret one position right.
- If this is the right most cell and EnableCircularNavigation property is set to true, the cursor will be moved the next row and the left most column, unless this is the right most column of the last row, then the user will be asked whether a new row to be inserted.
Up Arrow key is pressed:
- If the cell is in single click selection mode: Selects the top cell.
Down Arrow key is pressed:
- If the cell is in single click selection mode: Selects the bottom cell.
"Tab" key is pressed:
- Selects the right cell.
- If the EnableCircularNavigation property is set to true and the focus is on the right most column the focus is move to the left most column of the next row.
"Enter" key is pressed:
- Selects the cell below the current one.
"Shift" + "Enter" keys are pressed:
- Selects the cell above the current one.
"Spacebar" key is pressed:
- Selects/shows the content of the editor control.
"Esc key is pressed:
- Returns the cell/editor to single select mode.
- If the Esc key is pressed second time it asks the user whether he/she want to discard the changes that were made to the temporary data source.
Context menu key is pressed:
o Opens the row-context menu that allows you to insert, delete, save, and discard the changes.
Adding rows and saving data
Adding new row to RadGrid:
- Add new row by pressing the "Add New Row" link from the RadGrid Command item.
- When the most right and most bottom cell is selected and user presses the Right arrow or "Tab" or "Enter" keys.
- When the RadGrid last row's cell is selected and user press Down arrow or "Enter" keys.
- When the “InsertBefore” or “InsertAfter” option is selected from the row-context menu. Note that these options are only applicable until you discard the changes or refresh the page. If you refresh the page the order of the inserted items won’t be persisted and most probably they will appear at the bottom of the Grid.
Saving the RadGrid data into the database:
- Save data by pressing the "Save in Database" link from the Grid Command Item. The new inserted rows and the updated rows from the RadGrid are saved in the database.
- From the row-context menu there are two options that could be used to save the data:
- Save – saves the changes to the temporary data source.
- Synch Database – saves the changes to the permanent data source.
- Prior any operation requiring rebinding of the Grid, the data is saved to the temporary data source(DataTable object). Thus, there will be no loss of data.
Current Limitations
o Once you are in the filter item you need to return to the data portion of the Grid using the mouse.
o Inside the DropDownColumn you need to click twice, one time to focus the cell and the second time to expand the dropdown. Due to the specific type of input the DropDownList could not be opened with the keyboard, however, the values could be changed with the up and down arrows after the spacebar key is pressed.
o When you are in double selected mode you need either to press the Enter or the Esc keys in order to proceed with the navigation.
o If you focus the date input with the mouse you will need to bring the focus to another cell with the mouse in order to continue navigating the cells with the keyboard.
o Does not support copying of rows and columns from and to Excel or any other table based control or source.