I'd like to replace the "edit-delete-etc" text of GridHyperlinkColums with the GridCommandColumn sprites, per the current skin, and display accordingly to skin setting changes.
What's the simplest and most logical way to do it?
Or, would it be better to use a GridTemplateColumn?
Or.. maybe force a GridCommandColumn to act like a link??
Thanks for help.. opinions.
David
What's the simplest and most logical way to do it?
Or, would it be better to use a GridTemplateColumn?
Or.. maybe force a GridCommandColumn to act like a link??
Thanks for help.. opinions.
David
1 Answer, 1 is accepted
0
Hi David,
I have made an example, which shows three alternative ways to achieve the desired button appearance - a ButtonColumn, a HyperLinkColumn and a TemplateColumn.
As you will see, the HyperLinkColumn and the ButtonColumn require some programming. The HyperLink Column also requires an additional custom CSS class to be applied to the hyperlinks. The template column requires no code-behind and no additional CSS classes.
Depending on your scenario and requirements, pick what suits you best.
Regards,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
I have made an example, which shows three alternative ways to achieve the desired button appearance - a ButtonColumn, a HyperLinkColumn and a TemplateColumn.
As you will see, the HyperLinkColumn and the ButtonColumn require some programming. The HyperLink Column also requires an additional custom CSS class to be applied to the hyperlinks. The template column requires no code-behind and no additional CSS classes.
Depending on your scenario and requirements, pick what suits you best.
| <%@ Page Language="C#" %> |
| <%@ Import Namespace="System.Data" %> |
| <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> |
| <script runat="server"> |
| protected void RadGrid_NeedDataSource(object sender, GridNeedDataSourceEventArgs e) |
| { |
| DataTable dt = new DataTable(); |
| DataRow dr; |
| int rowsNum = 10; |
| dt.Columns.Add("ButtonText"); |
| for (int i = 1; i <= rowsNum; i++) |
| { |
| dr = dt.NewRow(); |
| dr["ButtonText"] = "ButtonText"; |
| dt.Rows.Add(dr); |
| } |
| (sender as RadGrid).DataSource = dt; |
| } |
| protected void RadGrid_ItemDataBound(object sender, GridItemEventArgs e) |
| { |
| if (e.Item is GridDataItem) |
| { |
| ((e.Item as GridDataItem)["HyperLinkColumn"].Controls[0] as HyperLink).CssClass = "rgAdd MyLink"; |
| ((e.Item as GridDataItem)["ButtonColumn"].Controls[0] as Button).CssClass = "rgUpdate"; |
| ((e.Item as GridDataItem)["ButtonColumn"].Controls[0] as Button).ToolTip = "Update"; |
| } |
| } |
| </script> |
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" |
| "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml"> |
| <head runat="server"> |
| <meta http-equiv="content-type" content="text/html; charset=utf-8" /> |
| <title>RadControls for ASP.NET AJAX</title> |
| <style type="text/css"> |
| .MyLink |
| { |
| display:block; |
| overflow:hidden; |
| text-decoration:none; |
| text-indent:-2222px; |
| } |
| </style> |
| </head> |
| <body> |
| <form id="form1" runat="server"> |
| <asp:ScriptManager ID="ScriptManager1" runat="server" /> |
| <telerik:RadGrid |
| ID="RadGrid1" |
| runat="server" |
| OnNeedDataSource="RadGrid_NeedDataSource" |
| Skin="Office2007" |
| AutoGenerateColumns="false" |
| OnItemDataBound="RadGrid_ItemDataBound"> |
| <MasterTableView> |
| <Columns> |
| <telerik:GridButtonColumn UniqueName="ButtonColumn" HeaderText="ButtonColumn" ButtonType="PushButton" /> |
| <telerik:GridHyperLinkColumn UniqueName="HyperLinkColumn" HeaderText="HyperLinkColumn" DataTextField="ButtonText" DataNavigateUrlFields="ButtonText" /> |
| <telerik:GridTemplateColumn UniqueName="TemplateColumn" HeaderText="TemplateColumn"> |
| <ItemTemplate> |
| <asp:Button ID="ButtonEdit" runat="server" CssClass="rgEdit" Text=" " ToolTip="Edit" /> |
| <asp:Button ID="ButtonDelete" runat="server" CssClass="rgDel" Text=" " ToolTip="Delete" /> |
| </ItemTemplate> |
| </telerik:GridTemplateColumn> |
| </Columns> |
| </MasterTableView> |
| </telerik:RadGrid> |
| </form> |
| </body> |
| </html> |
Regards,
Dimo
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.