< telerik:GridEditCommandColumn/> and imagebutton hover

When i change the styles for Telerik, i want the imagebutton used in < telerik:GridEditCommandColumn/> and <telerik:GridButtonColumn>  display different image when mouse hover it. i didn't know where is a property that i can set to show an alternative image when i hover over a GridButtonColumn cotrol item and the ButtonType is set to imageButton. So i find a way from internet:

aspx:
<telerik:RadGrid runat="server" ID="gvData" onitemdatabound="gvData_OnRowDataBound" >
   <telerik:GridEditCommandColumn  ButtonType="ImageButton" UniqueName="ibtnEdit" EditImageUrl="~/Images/grid_edit.png" ></telerik:GridEditCommandColumn>
      <telerik:GridButtonColumn ButtonType="ImageButton" ImageUrl="~/Images/grid_delete.png" UniqueName="ibtnDelete"  CommandName="Delete" Text="Delete" ConfirmText="Are you sure you want to delete this record?" ConfirmDialogType="RadWindow" ConfirmTitle="Delete" />
</telerik:RadGrid>
 
C#:
  protected void gvData_OnRowDataBound(object source, Telerik.Web.UI.GridItemEventArgs e)
{
   if (e.Item is GridDataItem)
   {
    GridDataItem gditem = (GridDataItem)e.Item;
    ImageButton ibtnDelete = (ImageButton)gditem["ibtnDelete"].Controls[0];
    ibtnDelete.Attributes.Add("onmouseover", "this.src=\"" + ResolveUrl("~/Images/delete_hover.png") + "\"");
    ibtnDelete.Attributes.Add("onmouseout", "this.src=\"" + ResolveUrl("~/Images/delete.png") + "\"");
    ImageButton ibtnEdit = (ImageButton)gditem["ibtnEdit"].Controls[0];
    ibtnEdit.Attributes.Add("onmouseover", "this.src=\"" + ResolveUrl("~/Images/edit_hover.png") + "\"");
    ibtnEdit.Attributes.Add("onmouseout", "this.src=\"" + ResolveUrl("~/Images/edit.png") + "\"");
   }
}

it can work.

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章