![WebDataGrid Using Editor Providers 01.png](images/WebDataGrid_Using_Editor_Providers_01.png)
Some default editors in WebDataGrid™ may not be useful in your application. However, you can specify the editor that proves most useful for a column by using the EditorProviders collection.
You will learn how to use the DatePickerProvider in a DateTime column for editing.
Bind WebDataGrid to a SqlDataSource component retrieving data from the Orders table. Retrieve the OrdersID, CustomerID, OrderDate, and RequiredDate fields. For more information on doing this, see Getting Started with WebDataGrid.
In the Microsoft® Visual Studio™ property window, locate the EditorProviders property and click the ellipsis (…) button to launch the Editor Providers Designer.
Click the + button to drop-down a list of possible editors. Select one to make it available later when you are setting up columns. For our purposes, select the DatePickerProvider.
Leave the ID for the editor as DatePickerProvider1 in the property grid on the right. You will need this ID later when setting the editor for a column. You can set any additional properties for the editor control by expanding the EditorControl property.
Click Apply then OK to close the designer.
Locate the Behaviors property and click the ellipsis (…) button to launch the Behaviors Editor Dialog.
Check the Cell Editing behavior in the list on the left to enable editing.
Locate the ColumnSettings property in the property grid on the right and click the ellipsis (…) button to launch the Column Settings Editor Dialog.
Configure WebDataGrid to use the DatePickerProvider for editing of the RequiredDate column.
Add a column setting by clicking the Add button.
Set the ColumnKey as RequiredDate.
For the EditorID property, click the dropdown list and select DatePickerProvider1. Only editors that are added to the EditorProviders collection are available here.
Leave ReadOnly as False.
Click OK.
Click Apply then OK to close the dialog.
You can also do the above steps in code.
In Visual Basic:
' Enable cell editing Me.WebDataGrid1.Behaviors.CreateBehavior(Of EditingCore)() Me.WebDataGrid1.Behaviors.EditingCore.Behaviors.CreateBehavior(Of CellEditing)() ' Create an editor provider Dim datePickerProvider As New DatePickerProvider() datePickerProvider.ID = "DatePickerProvider1" ' Add to collection Me.WebDataGrid1.EditorProviders.Add(datePickerProvider) ' Create a column setting to use the editor provider Dim columnSetting As New EditingColumnSetting() columnSetting.ColumnKey = "RequiredDate" ' Assign editor for column to use columnSetting.EditorID = datePickerProvider.ID ' Add column setting Me.WebDataGrid1.Behaviors.EditingCore.Behaviors.CellEditing.ColumnSettings.Add(columnSetting)
In C#:
// Enable cell editing this.WebDataGrid1.Behaviors.CreateBehavior<EditingCore>(); this.WebDataGrid1.Behaviors.EditingCore.Behaviors.CreateBehavior<CellEditing>(); // Create an editor provider DatePickerProvider datePickerProvider = new DatePickerProvider(); datePickerProvider.ID = "DatePickerProvider1"; // Add to collection this.WebDataGrid1.EditorProviders.Add(datePickerProvider); // Create a column setting to use the editor provider EditingColumnSetting columnSetting = new EditingColumnSetting(); columnSetting.ColumnKey = "RequiredDate"; // Assign editor for column to use columnSetting.EditorID = datePickerProvider.ID; // Add column setting this.WebDataGrid1.Behaviors.EditingCore.Behaviors.CellEditing.ColumnSettings.Add(columnSetting);
Run your application. When you enter edit mode in a cell of the RequiredDate column, the DatePickerEditor displays.
the time part of the DateTime object will change to the start of the new Day that was selected [8/20/2016 12:00:00 AM]
Full DateTime object contains the date and time part of the value. Example: [8/19/2016 1:48:29]