2013-07-11 29 views
1

荫具有图像控制,如何将动态工具提示添加到gridview中的图像控件?在GridView控件

<asp:ImageButton ID="imgbtnInfo" runat="server" ImageUrl="info.jpg" ToolTip="Button info" title="Info" CommandArgument='<%#Eval("ID") %>' CommandName="Info" /> 

这是我的网格视图图像按钮,在那里我得到我的每一行的动态的ID作为

imgbtnInfo0 
    imgbtnInfo1 
    imgbtnInfo2 

在这些方式取决于我多少行会获取图像按钮的ID,

我只是想生成工具提示动态使用Ajax或服务器端,我没有任何想法 任何一个可以帮助

+0

有提示的所有图像相同的文字? – anmarti

回答

0

如果文字是可以assing CSS类的图像控制的所有图像相同的:

<asp:ImageButton ID="imgbtnInfo" CssClass="imgtooltip" runat="server" /> 

,然后调用了jQuery UI框架tooltip功能:

$('.imgtooltip').tooltip(); 

在如果每行都必须有自己的工具提示文本,则可以在服务器端设置title属性。在你的情况下,因为你正在使用GridView你可以使用onrowdatabound事件。

<asp:gridview 
    onrowdatabound="myGridView_RowDataBound" 
    runat="server"> 
    </asp:gridview> 


void myGridView_RowDataBound(Object sender, GridViewRowEventArgs e) 
{ 

    if(e.Row.RowType == DataControlRowType.DataRow) 
    { 
     // Set the title text 
     e.Row.Cells[yourImageIndex].Title = "yourTooltipText"; 
    } 
} 

如果你知道在客户端(javasctip)的title文本,您还可以使用jQuery的each方法循环throwgh你的GridView表中设置该值。

编辑:

如果你需要从我建议您设置在服务器端代码此值的数据库的工具提示文本。你可以将它绑定到一个自定义的html属性。

tool='<%# Eval("toolAtServerSideDataSource") %>' 

这个例子说明了如何设置名为tool作为工具提示保存属性:

演示:http://jsfiddle.net/y6rvs/1/

+0

可以请你解释客户端的一些代码..,我想每个行都有diff工具提示 –

+0

@þÍńķ你如何知道或获取工具提示文本? – anmarti

+0

我需要从数据库中获取名称并绑定它 –