Accendo / Publikované

Tip:Tooltips for image button field in aspx GridView


Autor:  Libor Bešenyi

Dátum:  21.1.2010



            There are two possible ways how can display tooltips for your icons created in ButtonFields. First is more elegant – use TemplateField instead of FieldButton:


<asp:ButtonField Text="Details" CommandName="Details" ButtonType="Image"

ImageUrl="~/Images/Detail.gif" />






              <asp:ImageButton id="DetailButton" runat="server"



                     ImageUrl="~/Images/ Detail.gif" />




If you want, you can use ButtonField, but this change needs use self GridView:


public class MyGridView : GridView

protected override void InitializeRow(GridViewRow row, DataControlField[] fields)


              base.InitializeRow(row, fields);


              if (row.RowType == DataControlRowType.DataRow)


                     for (int index = fields.Length - 1; index >= 0; index--)


                           if (fields[index] is ButtonField && (fields[index] as ButtonField).ButtonType == ButtonType.Image)


                                   if (row.Cells[index].Controls[0] != null && row.Cells[index].Controls[0] is WebControl)

                                         ((WebControl)row.Cells[index].Controls[0]).Attributes["title"] = (fields[index] as ButtonField).Text;

                            } // if


First control in ButtonField is DataControlImageButton which is not visible from code. However this class is derived from WebControl and WebControl including attributes. We now, this class generate input tag of image type which for W3C implemented title attribute. So we were force text into this attribute.