开发者

Ext JS Grid Panel: How to show content on mousehover

开发者 https://www.devze.com 2023-03-20 12:44 出处:网络
I am displaying a ext JS grid panel with 2 columns. I have to keep fixed width of both columns. My problem is that when a text is displayed in 1st column and when it exceeds its width, I don\'t have a

I am displaying a ext JS grid panel with 2 columns. I have to keep fixed width of both columns. My problem is that when a text is displayed in 1st column and when it exceeds its width, I don't have any way to see the entire text (I can manually stretch it but because o开发者_JS百科f fixed width it doesn't show sometimes). May be anyone know How can I do it-

I mean - I can show the text on mousehover but I want it to display text if user keeps mouse pointer more than 5 sec otherwise it will be too annoying; if user takes his mouse from 1st row to last.

Any other idea would also be helpful.


Add the following style to your stylesheet:

.wordwrap {
    white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word;
    white-space: normal; /* Internet Explorer 5.5+ */
}

and then include it in the 'cls' config of your column:

columns: [{
    header: "Column 1",
    dataIndex: 'Col1',
    cls: 'wordwrap'
}]

That should wrap your grid cell's contents.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号