Discuss anything related to web development but no technical support questions


Post by xjpmauricio »

Hi, is there a way i can set the width of an event tooltip? I'm feeling quite stupid! I tried css, etc and nothing.

This is what i have:
             tooltipTpl : new Ext.XTemplate(
                '<dl class="eventTip">', 
                    '<dt class="icon-task"></dt><dd><b>{Title}</b>{[values.Description ? ( values.eventTypeId == 2 ? "" : (" (" + values.Description + ")")) : ""]}</dd>',
                    '<dt class="icon-clock">Start: </dt><dd>{[values.StartDate.format("Y-m-d G:i")]}</dd>',
                    '<dt class="icon-clock">End: </dt><dd>{[values.EndDate.format("Y-m-d G:i")]}</dd>',
                '</dl>').compile(),
Thanks.

Post by mats »

You can configure the tip by using this property on the schedulerpanel (note the 'width' property):
/* Here are the default tip config values */
tipCfg : {
        mouseOffset : [5,-50],
        cls : 'sch-tip',
        trackMouse: true,
        showDelay:1000,
        autoHide : false,
        width : Ext.isIE ? 140 : undefined
    },

Post by xjpmauricio »

Hi, thanks fro the quick reply. I've noticed that in Firefox the width is allways ok but with the code you've given, the width is now ok in IE8 also. I got to use IE (i know it sucks! customer demand!).
I still have a small problem like show in the image:
Untitled.png
Untitled.png (3.57 KiB) Viewed 4990 times
...basically the fields Start and End don't show the values correctly; the values are allways on anoher line, instead of being in front of the field name;
This is what i'd like to have: Start: dd-mm-yyyy.

...does this has anything to do with the fact that i'm using dl's and dt's on the tooltip html?

Any ideias?

Post by mats »

Yes, that's not a bug - that's how dl/dts are displayed by browsers. You'll have to create your own HTML template :)

Post Reply