This is a migrated thread and some comments may be shown as answers.

Editing cells in RadGrid

4 Answers 415 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Nick
Top achievements
Rank 2
Nick asked on 11 Jun 2012, 09:07 PM
Hello,

I am very new to .NET and the telerik UI (5 days of experience) and I am working with radgrid. I know many people have posted questions about this before, but I still can't seem to figure it out. I have a grid that gets its original data from a database. I want to be able to edit each cell individually and update the data to the database. I have been trying for hours but I can't get any of the cells to edit or even get any handlers to fire. Thank you in advance.

ASP.NET code:
<body>
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <div>
      
    
            
        <telerik:RadGrid ID="GrdConfig" runat="server" CellSpacing="0" GridLines="None" 
            EnableLinqExpressions="False" oncolumncreated="GrdConfig_ColumnCreated" 
            CssClass="MyRadGridCssClass" AllowPaging="True">
            <ClientSettings>
                <Resizing AllowColumnResize="True" />
                <Scrolling AllowScroll="True" />
            </ClientSettings>
            <MasterTableView>
                <CommandItemSettings ExportToPdfText="Export to PDF"></CommandItemSettings>
  
                <RowIndicatorColumn Visible="True" FilterControlAltText="Filter RowIndicator column">
                    <HeaderStyle Width="20px"></HeaderStyle>
                </RowIndicatorColumn>
  
                <ExpandCollapseColumn Visible="True" FilterControlAltText="Filter ExpandColumn column">
                    <HeaderStyle Width="20px"></HeaderStyle>
                </ExpandCollapseColumn>
  
                <EditFormSettings>
                    <EditColumn FilterControlAltText="Filter EditCommandColumn column"></EditColumn>
                </EditFormSettings>
  
            </MasterTableView>
  
            <FilterMenu EnableImageSprites="False"></FilterMenu>
        </telerik:RadGrid>
      
    </div>
    </form>
</body>
</html>

C# code:
public partial class Configurations : System.Web.UI.Page
    {
  
        protected void Page_Load(object sender, EventArgs e)
        {
                
                 ** Code to extract data from database goes here**

 
            GrdConfig.DataSource = data;
            GrdConfig.DataBind();
  
            GridGroupByExpression expression = GridGroupByExpression.Parse("ConfigFile[Config File:] Group by ConfigFile");
            GrdConfig.MasterTableView.GroupByExpressions.Add(expression);
              
            GridColumn cConfig = GrdConfig.MasterTableView.GetColumnSafe("ConfigFile");
             
            cConfig.Visible = false;
  
            GrdConfig.Rebind();
            
        }
  
        
        protected void GrdConfig_ColumnCreated(object sender, GridColumnCreatedEventArgs e)
        {
            if (e.Column is GridGroupSplitterColumn)
            {
                e.Column.HeaderStyle.Width = Unit.Pixel(1);
                e.Column.HeaderStyle.Font.Size = FontUnit.Point(1);
                e.Column.ItemStyle.Width = Unit.Pixel(1);
                e.Column.ItemStyle.Font.Size = FontUnit.Point(1);
                e.Column.Resizable = false;
            }
        }
  
        protected void GrdConfig_ItemDataBound(object sender, GridItemEventArgs e)
        {
            if (e.Item is GridGroupHeaderItem)
            {
                GridGroupHeaderItem groupHeader = (GridGroupHeaderItem)e.Item;
                groupHeader.Font.Bold = true;
            }
        }
    }
}

Please Note: This is the code that generates the grid using the data from the database. I need to modify this code to make the grid editable. Thank you

4 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 12 Jun 2012, 04:04 AM
Hi Nick,

RadGrid provides AutoGenerateEditColumn Property which specifies whether the table views in the grid automatically insert a GridEditCommandColumn column before any auto-generated data columns to allow the user to edit the data in the grid rows. This default behavior can be overridden by the AutoGenerateEditColumn property of any GridTableView in the grid.

ASPX:
<telerik:RadGrid ID="GrdConfig" runat="server" CellSpacing="0" GridLines="None" EnableLinqExpressions="False" oncolumncreated="GrdConfig_ColumnCreated" CssClass="MyRadGridCssClass" AllowPaging="True" AutoGenerateEditColumn="true">
. . .
. . .
Take a look into this help documentation about RadGrid's smart tags.

You can update the edited data to the database in UpdateCommand event.

C#:
protected void GrdConfig_UpdateCommand(object sender, GridCommandEventArgs e)
{
   // code to update the RadGrid
}

Or please look into this demo which specifies Automatic update, delete and insert operation in RadGrid.

Thanks,
Shinu.
0
Nick
Top achievements
Rank 2
answered on 14 Jun 2012, 08:28 PM
Thanks Shinu, this worked well.

However, when I enter the data into the update textbox, I can't get the grid to update the data. This is not because I am not Rebinding the data, it is merely because I don't know how to tell the grid to update based on the input in the first place.

Thank you.
0
Accepted
Tsvetoslav
Telerik team
answered on 15 Jun 2012, 06:16 AM
Hi Nick,

When you click the Update button the UpdateCommand handler is thrown. In the command handler you have a GridCommandEventArgs object which features an Item property. So, e.Item will give you access to the edit form of the item currently being updated. That edit form contains the new values to be written to the database. So, the only thing that you need to do is get those values. And this is easily done through the ExtractValues method of the GridEditableItem object: ((GridEditableItem)e.Item).ExtractValues(newValues) will populates newValues with a key/value collection of column uniquenames/new values. The newValues object should be a Hashtable. Now that you have the new values, just use them to updated the database - leave the remaining to RadGrid as it will automatically rebind and display the new data.

Hope it helps.

Regards,
Tsvetoslav
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Nick
Top achievements
Rank 2
answered on 15 Jun 2012, 06:19 PM
That was an extremely helpful answer, thank you so much!

I think I'm at my last issue now. When I extract the values, the value  bounded to the columns I edited in the hashtable are still the old values. Any explanation for this?

Edit: I have reposted this question as a new topic.

-Nick
Tags
Grid
Asked by
Nick
Top achievements
Rank 2
Answers by
Shinu
Top achievements
Rank 2
Nick
Top achievements
Rank 2
Tsvetoslav
Telerik team
Share this question
or