my app has some particularly long dropdownlist items. rather than
taking up such wide realestate, i'm looking to have the dropdown's
width grow upon focus and shrink back on lose focus. however i'm
meeting all kinds of other odd occurrances and i'm not sure what's
going on.
here's a simple example:
<html>
<script language="javascript">
function ChangeListBoxWidth(obj)
{
//alert(obj.style.width);
obj.style.width = "500px";
//alert(obj.style.width);
}
function ResetListBoxWidth(obj,width)
{
obj.style.width = width;
}
</script>
<select id="ddltest" style="width:200px;
"OnFocus="javascript:ChangeListBoxWidth(this); "
OnBlur="javascript:ResetListBoxWidth(this,200);">
<option selected="selected" value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</html>
As written above, the correct behavior will be had while tabbing
through the controls, but when using mouseclicks, though the select
will resize, it somehow loses the selectedindex entirely and ends up
pointing to none of its' contents.
if you uncomment just the FIRST alert, prior to the resize, it again
seems to work tabbing through. clicking will work once, and then not
again; in fact, the second time onward, one can't keep focus on the
control, after confirming the alert, focus always goes back to the
addressbar.
if you uncomment BOTH alerts, they display the correct values, 200 and
500px respectively, but the resize never happens, tabbing OR mouse. in
fact, any code after the resize command seems to negate it's effect.
what the hell's going on here??
3  4951 
evilmousse wrote:
my app has some particularly long dropdownlist items. rather than
taking up such wide realestate, i'm looking to have the dropdown's
width grow upon focus and shrink back on lose focus. however i'm
meeting all kinds of other odd occurrances and i'm not sure what's
going on.
here's a simple example:
<html>
<script language="javascript">
function ChangeListBoxWidth(obj)
{
//alert(obj.style.width);
obj.style.width = "500px";
//alert(obj.style.width);
}
function ResetListBoxWidth(obj,width)
{
obj.style.width = width;
}
</script>
You need the "units", ITC "px".
function ResetListBoxWidth(obj,width){
obj.style.width = width +"px";
}
Personally, I wouldn't use "width" as a parameter
function ResetListBoxWidth(obj,wideness){
obj.style.width = wideness +"px";
}
<select id="ddltest" style="width:200px;"
onfocus="ChangeListBoxWidth(this);"
onchange="ResetListBoxWidth(this,200);">
I would use lower case for the event handlers, onchange makes more sense
ITC.
Mick
>
<select id="ddltest" style="width:200px;
"OnFocus="javascript:ChangeListBoxWidth(this); "
OnBlur="javascript:ResetListBoxWidth(this,200);">
<option selected="selected" value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
</html>
As written above, the correct behavior will be had while tabbing
through the controls, but when using mouseclicks, though the select
will resize, it somehow loses the selectedindex entirely and ends up
pointing to none of its' contents.
if you uncomment just the FIRST alert, prior to the resize, it again
seems to work tabbing through. clicking will work once, and then not
again; in fact, the second time onward, one can't keep focus on the
control, after confirming the alert, focus always goes back to the
addressbar.
if you uncomment BOTH alerts, they display the correct values, 200 and
500px respectively, but the resize never happens, tabbing OR mouse. in
fact, any code after the resize command seems to negate it's effect.
what the hell's going on here??
thanks for the response. first off, onchange can't be the
width-resetting option because the user may not change the selecteditem
after reading the full contents. i want the width to reset when they
move on to any other control, regardless of change, so onblur.
i've tried your suggestions and i'm getting different results.. still
not 100% tho. here's my amended code:
<html>
<script language="javascript">
function ChangeListBoxWidth(obj)
{
alert(obj.style.width);
obj.style.width = "500px";
alert(obj.style.width);
}
function ResetListBoxWidth(obj,wideness)
{
obj.style.width = wideness +"px";
}
</script>
<select id="ddltest" style="width:200px;"
onfocus="javascript:ChangeListBoxWidth(this);"
onblur="javascript:ResetListBoxWidth(this,200);">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option selected="selected" value="3">3</option>
<option value="4">4</option>
</select>
</html>
now with the alerts commented out, firefox behaves correctly with both
mouse and tabbing (unfortunately my app's viewed in IE...) but ie,
while resizing the dropdown correctly now, still loses track of the
selectedindex and points to none in the list.
uncommenting both alerts still breaks everything in both ie and
firefox: i can see the list gets momentarily wider only to reset
itself.
the alerts still display the appropriate info, and even before i coded
in the +"px", they displayed such, so i knew the unit was being taken
implicity already.
evilmousse wrote:
thanks for the response. first off, onchange can't be the
width-resetting option because the user may not change the selecteditem
after reading the full contents. i want the width to reset when they
move on to any other control, regardless of change, so onblur.
i've tried your suggestions and i'm getting different results.. still
not 100% tho. here's my amended code:
<html>
<script language="javascript">
function ChangeListBoxWidth(obj)
{
alert(obj.style.width);
obj.style.width = "500px";
alert(obj.style.width);
}
function ResetListBoxWidth(obj,wideness)
{
obj.style.width = wideness +"px";
}
</script>
<select id="ddltest" style="width:200px;"
onfocus="javascript:ChangeListBoxWidth(this);"
onfocus="ChangeListBoxWidth(this);"
onblur="javascript:ResetListBoxWidth(this,200);">
onblur="ResetListBoxWidth(this,200);"
Works for me in FF2 & Safari 1.3 (both MAC);
Note no "javascript' protocol needed.
Mick
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option selected="selected" value="3">3</option>
<option value="4">4</option>
</select>
</html>
now with the alerts commented out, firefox behaves correctly with both
mouse and tabbing (unfortunately my app's viewed in IE...) but ie,
while resizing the dropdown correctly now, still loses track of the
selectedindex and points to none in the list.
uncommenting both alerts still breaks everything in both ie and
firefox: i can see the list gets momentarily wider only to reset
itself.
the alerts still display the appropriate info, and even before i coded
in the +"px", they displayed such, so i knew the unit was being taken
implicity already.
This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics
by: David Hayes |
last post by:
juglesh <juglesh@nospamRadioKDUG.com> wrote in "Re: how to maximize the
browser window that fits the monitor size?" (Saturday, January 01, 2005 3:12
AM):
>
> >I want to maximize the browser...
|
by: David Lozzi |
last post by:
Howdy,
I have a function that uploads an image and that works great. I love ..Nets built in upload, so much easier than 3rd party uploaders!
Now I am making a public function that will take the...
|
by: Jim Langston |
last post by:
I really am not sure if this question belongs in this newsgroup, but not
sure where else to ask it.
There is someone working on a game that I tested, and it was taking >30
seconds to load. He...
|
by: Abubakar |
last post by:
Hi,
I'm working on a SDI application using MFC ( vc2k5). I have a class that
inherits from CDialogBar and is called CDlgbar2. Inside this bar I place a
dialog that has a label and a dropdown...
|
by: Abdhul Saleem |
last post by:
Hi,
Any code snippet or help link available on how to auto resize the dropdown
list part of the combo(<select>) ?
Or, is there any alternative techniques for displaying the full lenth text...
|
by: |
last post by:
I'm creating a user control where the size always needs to be divisible by three.
In the resize event within the custom control I'm having no problem maintaining the height to be the same as the...
|
by: Andrus |
last post by:
I'm using WinForms DataGridView
I need to make dropdown list wider that grid column width.
I tried the following code, but dropdown list widht is the same as column
width.
How to increase...
|
by: zion4ever |
last post by:
Hello good people,
Please bear with me as this is my first post and I am relative new to ASP. I do have VB6 experience. I have a form which enables users within our company to do an intranet...
|
by: tokcy |
last post by:
Hi everyone,
I am new in php and ajax, i am facing the prob while i click on element of first drop down then in second dropdown all element showl come from database.
I mean i have three dropdown 1....
|
by: Charles Arthur |
last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
|
by: ryjfgjl |
last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
|
by: emmanuelkatto |
last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud.
Please let me know.
Thanks!
Emmanuel
|
by: BarryA |
last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
|
by: Sonnysonu |
last post by:
This is the data of csv file
1 2 3
1 2 3
1 2 3
1 2 3
2 3
2 3
3
the lengths should be different i have to store the data by column-wise with in the specific length.
suppose the i have to...
|
by: Hystou |
last post by:
There are some requirements for setting up RAID:
1. The motherboard and BIOS support RAID configuration.
2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
|
by: Oralloy |
last post by:
Hello folks,
I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>".
The problem is that using the GNU compilers,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
| |
