PDA

View Full Version : QuickTips ext:width goes wacky


Nullity
18 Apr 2007, 7: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
18 Apr 2007, 9:56 AM
try ext:maxWidth="100"
Nullity
18 Apr 2007, 10:15 AM
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
18 Apr 2007, 10:26 AM
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
18 Apr 2007, 1: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
18 Apr 2007, 1: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
18 Apr 2007, 3:14 PM
This is already fixed in SVN.
Nullity
18 Apr 2007, 3:45 PM
Thanks Jack!