Hi all,
Users would like to have the ability to click on a row in the datagrid and have it go into edit mode. Then, tab through each of the cells changing data, then when they leave the row, save the data. I'm binding using the Need_DataSource event so I'm NOT using a data source contol. I can handle all of the saving.
I don't want to use Javascript. I'd rather fire a command event when the click the row and fire a command event when the leave the row. (BUT HOW?) I'll then put the row into edit mode.
NOTE: I will be using controls in different cells like comboboxes. I can create these manually in the grid and just hide them if I don't want them to displayed to the user. (if you see in my code, I have a ConfigureGridColumn() method for doing this - and that part already works).
How do I:
- Fire an event when the click the row and when they leave the row without javascript? (can I use the ItemCommand?)
- Add markup for a ComboBox, MaskedEdit, NumericText, etc. to cells
Here's the markup I have so far:
<telerik:RadGrid ID="EditableGrid" runat="server" Skin="Gray"
GridLines="None" OnNeedDataSource="EditableGrid_NeedDataSource"
AllowPaging="True" AllowSorting="True"
OnItemCommand="EditableGrid_ItemCommand">
<PagerStyle Mode="NextPrevAndNumeric" />
<MasterTableView CommandItemDisplay="Top" EditMode="InPlace" >
<RowIndicatorColumn>
<HeaderStyle Width="20px"></HeaderStyle>
</RowIndicatorColumn>
<ExpandCollapseColumn>
<HeaderStyle Width="20px"></HeaderStyle>
</ExpandCollapseColumn>
</MasterTableView>
<FilterMenu EnableTheming="True">
<CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation>
</FilterMenu>
</telerik:RadGrid>
Here's my code:
protected void EditableGrid_NeedDataSource(object source, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
{
EditableGrid.DataSource = GetMyData();
EditableGrid.MasterTableView.DataKeyNames = new string[] { "MYDataID" };
}
protected void EditableGrid_ColumnCreated(object sender, Telerik.Web.UI.GridColumnCreatedEventArgs e)
{
//set column attributes - show/hide/width etc..
ConfigureGridColumn(e.Column);
}
protected void EditableGrid_ItemCommand(object source, GridCommandEventArgs e)
{
switch (e.CommandName.ToLower())
{
case "edit":
e.Item.Edit = true;
break;
case "update":
UpdateItem(e.Item);
break;
case "cancel":
e.Item.Edit = false;
break;
}
}
private void UpdateItem(GridItem gridItem)
{
DataTable dt = new DataTable();
//create an empty data table with all the columns from the grid
foreach (GridColumn column in EditableGrid.MasterTableView.RenderColumns)
{
dt.Columns.Add(new DataColumn(column.UniqueName));
}
DataRow dr = dt.NewRow();
//add data from grid to new row in data table
foreach (GridColumn column in EditableGrid.MasterTableView.RenderColumns)
{
dr[column.UniqueName] = ((gridItem as GridEditableItem).EditManager.GetColumnEditor(column.UniqueName) as GridTextColumnEditor).Text;
//for control within cell Does this work???
//RadComboBox control = (e.Item as GridEditableItem)["UNIQUE NAME"].Controls[0] as RadComboBox;
}
//My Custom entity to save data
MyEntity entity = MyEntity.DataBind(dr);
entity.SaveData();
}
Users would like to have the ability to click on a row in the datagrid and have it go into edit mode. Then, tab through each of the cells changing data, then when they leave the row, save the data. I'm binding using the Need_DataSource event so I'm NOT using a data source contol. I can handle all of the saving.
I don't want to use Javascript. I'd rather fire a command event when the click the row and fire a command event when the leave the row. (BUT HOW?) I'll then put the row into edit mode.
NOTE: I will be using controls in different cells like comboboxes. I can create these manually in the grid and just hide them if I don't want them to displayed to the user. (if you see in my code, I have a ConfigureGridColumn() method for doing this - and that part already works).
How do I:
- Fire an event when the click the row and when they leave the row without javascript? (can I use the ItemCommand?)
- Add markup for a ComboBox, MaskedEdit, NumericText, etc. to cells
Here's the markup I have so far:
<telerik:RadGrid ID="EditableGrid" runat="server" Skin="Gray"
GridLines="None" OnNeedDataSource="EditableGrid_NeedDataSource"
AllowPaging="True" AllowSorting="True"
OnItemCommand="EditableGrid_ItemCommand">
<PagerStyle Mode="NextPrevAndNumeric" />
<MasterTableView CommandItemDisplay="Top" EditMode="InPlace" >
<RowIndicatorColumn>
<HeaderStyle Width="20px"></HeaderStyle>
</RowIndicatorColumn>
<ExpandCollapseColumn>
<HeaderStyle Width="20px"></HeaderStyle>
</ExpandCollapseColumn>
</MasterTableView>
<FilterMenu EnableTheming="True">
<CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation>
</FilterMenu>
</telerik:RadGrid>
Here's my code:
protected void EditableGrid_NeedDataSource(object source, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
{
EditableGrid.DataSource = GetMyData();
EditableGrid.MasterTableView.DataKeyNames = new string[] { "MYDataID" };
}
protected void EditableGrid_ColumnCreated(object sender, Telerik.Web.UI.GridColumnCreatedEventArgs e)
{
//set column attributes - show/hide/width etc..
ConfigureGridColumn(e.Column);
}
protected void EditableGrid_ItemCommand(object source, GridCommandEventArgs e)
{
switch (e.CommandName.ToLower())
{
case "edit":
e.Item.Edit = true;
break;
case "update":
UpdateItem(e.Item);
break;
case "cancel":
e.Item.Edit = false;
break;
}
}
private void UpdateItem(GridItem gridItem)
{
DataTable dt = new DataTable();
//create an empty data table with all the columns from the grid
foreach (GridColumn column in EditableGrid.MasterTableView.RenderColumns)
{
dt.Columns.Add(new DataColumn(column.UniqueName));
}
DataRow dr = dt.NewRow();
//add data from grid to new row in data table
foreach (GridColumn column in EditableGrid.MasterTableView.RenderColumns)
{
dr[column.UniqueName] = ((gridItem as GridEditableItem).EditManager.GetColumnEditor(column.UniqueName) as GridTextColumnEditor).Text;
//for control within cell Does this work???
//RadComboBox control = (e.Item as GridEditableItem)["UNIQUE NAME"].Controls[0] as RadComboBox;
}
//My Custom entity to save data
MyEntity entity = MyEntity.DataBind(dr);
entity.SaveData();
}