显示工具提示使用的详细信息时mousover一个MVC3剃刀排的WebGrid(Show a too

我有人员名单的网格。 在鼠标悬停在一定的人行我想显示在工具提示中其他信息（照片，地址等）。 在模型中的所有需要​​的数据存在，但我不知道如何添加网格内的提示功能。 我也想知道，如果jQuery UI的工具提示是一个不错的选择呢？

TIA :)

Answer 1:

下面是代码样品，以显示在asp.net MVC的WebGrid工具提示：

grid.Column("LongTextColumn", "Column Header Here"
            , format: (item) => Html.Raw("<abbr style='background-color:Beige;'
              title='" + item.LongTextColumn + "'>" + item.OtherModelColumn + 
              "</abbr>"), canSort: false)

下面的版本显示长注释/文本列的25个字符，并显示了完整的文本作为工具提示的休息。 这也需要文本超过25个字符短的照顾。

grid.Column("ModelItem.LongTextColumn", "Column Header", format: (item) => 
             Html.Raw("<abbr style='background-color:Beige;' title='" +
             item.ModelItem.LongTextColumn + "'>" +
             item.ModelItem.LongTextColumn.PadRight(25).Substring(0, 25) + 
             "</abbr>"), canSort: false)

希望这可以帮助！

Answer 2:

尝试BeautyTips jQuery插件。 这是一个很好的加载Ajax内容。 它有很多的功能，它甚至支持HTML5。 看看他们的演示这里 。

文章来源: Show a tooltip with more info when mousover a MVC3 Razor WebGrid row