Geek asks and answers

SlickGrid: how to view full text in column headings?

I am using SlickGrid, and right now, if I have really large column headers, SlickGrid shortens the header using ellipses (...).

My question is: is there a way to view all the text on hover?


By the way, I was able to do this for long records in cells by registering this cool plugin https://github.com/mleibman/SlickGrid/blob/master/plugins/slick.autotooltips.js :

mygrid.registerPlugin(new Slick.AutoTooltips());

Here's jsFiddle using this plugin: http://jsfiddle.net/crystality/h5ZLP/1/

Note that if you hover over a cell with a long value, you can view the full record, but it does not do this for large column headings.

I think I can edit this plugin to allow this behavior. Any other suggestions? Thank!

+5
source share
2 answers

Good. I did it. The latest version of SlickGrid seems to have changed in how the title attribute is set in the column headers. Previously, the column name attribute would be set as the header. Now we need to add a new parameter to the column definition - . I edited your fiddle with this and now the tooltips work fine. toolTip

http://jsfiddle.net/100thGear/6sGXx/

I changed the column definition as follows:

{ id: "long-val", name: "Really Really Really Long Title", 
field: "longVal", sortable:true, 
toolTip: "Really Really Really Long Title" }

Please note that you do not need slick.autotooltips.js for this work. This is just for data tooltips.

Let me know if this helps!

+8

Auto Tooltips :

https://mleibman.imtqy.com/SlickGrid/examples/example-autotooltips.html

:

<script src="../plugins/slick.autotooltips.js"></script>

var options = {
    explicitInitialization: true,
};

grid.registerPlugin( new Slick.AutoTooltips({ enableForHeaderCells: true }) );
grid.init();
+1

More articles:


All Articles