【新特性速递】快速为RenderField增加提示信息（无需借助RendererFunction）

FineUIPro/Mvc/Core的下个版本（v7.0.0），我们为RenderField增加了ShowToolTip属性，再也无需仅仅为了一个提示信息就写RendererFunction了。

 

这个需求来自知识星球的网友：https://t.zsxq.com/Z7UjYrB

 

也就是说，为了给RenderField列增加提示信息，我们需要通过 RendererFunction 来添加，如下代码所示：

?

1 2 3 4 5

// 超链接标签 - 所学专业 function renderMajor(value, params) {     var url = 'http://gsa.ustc.edu.cn/search?q=' + F.urlEncode(value);     return F.formatString('<a href="{0}" data-qtip="{1}" target="_blank">{1}</a>', url, F.htmlEncode(value)); }

其中HTML标签属性data-qtip会被 FineUI 识别，并在光标移动到目标节点时，显示提示信息。

 

当然这个例子是为了渲染一个超链接，如果需求是生成一个包含提示信息的普通文本，则同样需要借助于RendererFunction：

?

1	<f:RenderField HeaderText="所学专业" DataField="Major" RendererFunction="renderMajor" Width="150px" />

对应的列渲染函数：

?

1 2 3

function renderMajor(value) {     return F.formatString('<span data-qtip="{0}">{0}</span>', F.htmlEncode(value)); }

虽然能够实现功能，但是代码却有点啰嗦。

 

下个版本，我们会针对这种情况进行优化，仅仅通过一个属性ShowToolTip就能实现上面的功能：

?

1	<f:RenderField HeaderText="所学专业" DataField="Major" ShowToolTip="true" ToolTipPosition="TopStart" Width="150px" />

是不是很简洁，而且还能指定提示信息的显示位置（ToolTipPosition）。　　

　　

页面显示效果：

　

 

欢迎入伙：https://fineui.com/fans/

三石出品，必属精品