PDA

View Full Version : QuickTips ext:width goes wacky


Nullity
04-18-2007, 11:18 AM
While testing some things for QuickTips in Ext 1.0 Final, I noticed that setting a width causes a very odd issue. It would be difficult to describe, so here is a short test:

<html>
<head>
<link rel='stylesheet' type='text/css' href='/ext/resources/css/ext-all.css'>
<script type="text/javascript" src="/ext/yui-utilities.js"></script>
<script type="text/javascript" src="/ext/ext-yui-adapter.js"></script>
<script type="text/javascript" src="/ext/ext-all-debug.js"></script>
</head>

<body>

<script type="text/javascript">
Ext.QuickTips.init();
</script>

<input type="button" id="qtip_btn" value="QuickTip Test" ext:qtip="QTip" ext:width="100">

</body>
</html>

tryanDLS
04-18-2007, 01:56 PM
try ext:maxWidth="100"

Nullity
04-18-2007, 02:15 PM
ext:maxWidth does nothing; it's not even a valid tag. From QuickTips.js:

tagConfig : {
namespace : "ext",
attribute : "qtip",
width : "width",
target : "target",
title : "qtitle",
hide : "hide",
cls : "qclass"
}

You can set 'Ext.QuickTips.maxWidth', but that's just a global to set the maximum width that each tip can be. This defaults to 300, so I'm still within limits when I try to set ext:width="100".

tryanDLS
04-18-2007, 02:26 PM
I don't know if config tags are being handled the same as when they're pulled as attributes of an Element. I tried maxWidth and it worked on your page.

Nullity
04-18-2007, 05:00 PM
Are you sure it worked? I changed this line:
<input type="button" id="qtip_btn" value="QuickTip Test" ext:qtip="QTip" ext:width="100">
to this:
<input type="button" id="qtip_btn" value="QuickTip Test" style="width: 200px;" ext:qtip="QTip" ext:maxWidth="200">
and I attached an image of the results.

It's not "working" per se, it's it's just not causing the error because ext:maxWidth is ignored completely (or isn't doing what we intend). I changed the size from 100 to 200 for easier comparison. As you can see using maxWidth, the qtip obivously isn't being set to 200px otherwise, it would be the same width as the button.

tryanDLS
04-18-2007, 05:58 PM
Maybe that's not why it worked. It appears looking at the rendered HTML, that the div is not getting a width, so in your case, it's 100% of it's container. If I put the input tag in a div with a width, the qtip width is constrained - not sure at this point, how it's being calculated.

jack.slocum
04-18-2007, 07:14 PM
This is already fixed in SVN.

Nullity
04-18-2007, 07:45 PM
Thanks Jack!