2011-12-21 76 views
1

我有一個人員列表的網格。在鼠標懸停時,我想在工具提示中顯示其他信息(照片,地址等)。 所有需要的數據都存在於模型中,但我不知道如何在網格中添加工具提示功能。我也想知道jquery ui tooltip是否是一個不錯的選擇?當mousover MVC3 Razor WebGrid行顯示工具提示更多信息

TIA :)

+0

是的,我會使用jQuery的工具提示。 – Evan 2011-12-21 15:42:47

回答

1

試試BeautyTips jquery插件。加載ajax內容是一個不錯的選擇。它有很多功能,甚至支持HTML5。看看他們的演示here

+0

看起來很有希望thnx :)我仍然想知道如何讓webgrid裏面的工具提示,所以我保持我的問題打開。 – Fred 2011-12-21 19:18:47

3

下面是代碼示例顯示工具提示在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) 

希望這有助於!