如何在jqGrid鼠标上方设置工具提示? [英] How to set the tool tip on jqGrid mouse over?

查看:270
本文介绍了如何在jqGrid鼠标上方设置工具提示?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如何设置将鼠标悬停在jqGrid行/单元格上方时出现的工具提示"?

How can you set the "tool tip" that appears when you hover your mouse over a jqGrid row/cell?

当前工具提示似乎只是单元格内容.

Currently the tool tip appears to just be the cell contents.

推荐答案

总的来说,我同意Justin的观点,即jqGrid无法让您直接在行上设置工具提示,您只能在单元格上执行此操作.因此,您必须手动执行此操作.

In general I agree with Justin, that jqGrid get you no direct way to set tooltip on the row, you can do this only on the cell basis. So you have to do this manually.

首先,您应该设置 title:false 所有单元格上的属性"以没有该单元格的工具提示.然后,您必须设置每行的自定义工具提示.例如,您可以在 loadComplete 事件中执行此操作处理.相应的代码可以大约如下:

First of all you should set title:false property on all cells to have no tooltip for the cells. Then you have to set your custom tooltips of every row. You can do this for example inside of loadComplete event handle. The corresponding code can be about following:

loadComplete: function() {
    var ids = grid.jqGrid('getDataIDs');
    for (var i=0;i<ids.length;i++) {
        var id=ids[i];
        var rowData = grid.jqGrid('getRowData',id);
        $('#'+id,grid[0]).attr('title', rowData.Name + ' (' +
                                        rowData.Category + ', ' +
                                        rowData.Subcategory + ')');
    }
}

您可以看到相应的示例,您可以在此处

You can see the corresponding example you can see live here.

更新:在jqGrid的较新版本中,有更有效的方法来设置自定义title.它是cellattr的用法(例如,请参见答案)或rowattr的用法(请参见答案).我建议始终使用jqGrid的gridview: true选项.将cellattrrowattrgridview: true结合使用,可以创建包含所有工具提示的完整网格正文,其中一个提示是在页面的一种修改中 (包含网格正文的完整HTML片段)所有工具提示中的都会分配给innerHTML属性).在循环中使用.attr至少要遵循回流范围很广(请参见此处).因此,将cellattrrowattrgridview: true结合使用可以实现最佳性能.

UPDATED: In more late versions of jqGrid there are much more effective way to set custom title. It's the usage of cellattr (see the answer for an example) or the usage of rowattr (see the answer). I recommend to use gridview: true option of jqGrid always. The usage of cellattr or rowattr together with gridview: true allows to create full grid body inclusive of all tooltips which one need in one modification of the page (the full HTML fragment of grid body inclusive of all tooltips will be assigned to innerHTML property). The usage of .attr in the loop follows at least to reflow which is expansive (see here). So the usage of cellattr and rowattr in combination with gridview: true allow to achieve the best performance.

这篇关于如何在jqGrid鼠标上方设置工具提示?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆