By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
448,610 Members | 1,587 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 448,610 IT Pros & Developers. It's quick & easy.

ALT function on <SELECT> option

P: n/a
Hi!, I want to fix via javascript the combo width to a fix value. I'd
like to implement a kind of ALT / TITLE function to show the entire
option when the text is longer than the combo width...
It's possible?!?
Thanks
Jul 23 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a


gekoblu wrote:
Hi!, I want to fix via javascript the combo width to a fix value. I'd
like to implement a kind of ALT / TITLE function to show the entire
option when the text is longer than the combo width...
It's possible?!?


You can set the width with CSS, you can set the title attribute as a
property with javascript:

<html lang="en">
<head>
<title>setting title of select element</title>
<script type="text/javascript">
function setTitleToSelectedText (select) {
if (select.selectedIndex > -1) {
select.title = select.options[select.selectedIndex].text;
}
}
</script>
<style type="text/css">
select {
width: 100px;
}
</style>
</head>
<body>
<form name="formName" action="">
<p>
<select name="select1" onchange="setTitleToSelectedText(this);">
<option>option 1 option 1 option 1</option>
<option>option 2 option 2 option 2</option>
<option>option 3 option 3 option 3</option>
</select>
</p>
<p>
<select name="select2" onchange="setTitleToSelectedText(this);" size="3">
<option>option 1 option 1 option 1</option>
<option>option 2 option 2 option 2</option>
<option>option 3 option 3 option 3</option>
</select>
</p>
</form>
<script type="text/javascript">
setTitleToSelectedText(document.forms.formName.ele ments.select1);
setTitleToSelectedText(document.forms.formName.ele ments.select2);
</script>
</body>
</html>

Note however that IE/Win doesn't support this (title attribute/property
of <select> elements), but Mozilla, Netscape 6/7, Opera 7 do
--

Martin Honnen
http://JavaScript.FAQTs.com/

Jul 23 '05 #2

P: n/a
Thanks Martin, unfortunately I had to use IE 6...
another problem is: if I fix the combo width, also the drop down menu
is resized and if the option is longer, it will be cutted!
I'd like a 'title' for each option even in the drop down, even befor a
select action... Do you think I'm wondering the moon?!? :-)
Martin Honnen <ma*******@yahoo.de> wrote in message news:<40********@olaf.komtel.net>...
gekoblu wrote:
Hi!, I want to fix via javascript the combo width to a fix value. I'd
like to implement a kind of ALT / TITLE function to show the entire
option when the text is longer than the combo width...
It's possible?!?


You can set the width with CSS, you can set the title attribute as a
property with javascript:

<html lang="en">
<head>
<title>setting title of select element</title>
<script type="text/javascript">
function setTitleToSelectedText (select) {
if (select.selectedIndex > -1) {
select.title = select.options[select.selectedIndex].text;
}
}
</script>
<style type="text/css">
select {
width: 100px;
}
</style>
</head>
<body>
<form name="formName" action="">
<p>
<select name="select1" onchange="setTitleToSelectedText(this);">
<option>option 1 option 1 option 1</option>
<option>option 2 option 2 option 2</option>
<option>option 3 option 3 option 3</option>
</select>
</p>
<p>
<select name="select2" onchange="setTitleToSelectedText(this);" size="3">
<option>option 1 option 1 option 1</option>
<option>option 2 option 2 option 2</option>
<option>option 3 option 3 option 3</option>
</select>
</p>
</form>
<script type="text/javascript">
setTitleToSelectedText(document.forms.formName.ele ments.select1);
setTitleToSelectedText(document.forms.formName.ele ments.select2);
</script>
</body>
</html>

Note however that IE/Win doesn't support this (title attribute/property
of <select> elements), but Mozilla, Netscape 6/7, Opera 7 do

Jul 23 '05 #3

P: n/a
In IE 6, one way that you have to display the complete option
is to put (via javascript) a title on the word that you have sitting
next to the SELECT element saying what it is (like Choices:). Then
IF the user thinks to put hir mouse over that word, he could find out
what the complete option is. However, this still won't do what you're
asking for (where there is a title as you hilight a choice before
selection).

Csaba Gabor

"gekoblu" <ge*****@tiscali.it> wrote in message
news:47**************************@posting.google.c om...
Thanks Martin, unfortunately I had to use IE 6...
another problem is: if I fix the combo width, also the drop down menu
is resized and if the option is longer, it will be cutted!
I'd like a 'title' for each option even in the drop down, even befor a
select action... Do you think I'm wondering the moon?!? :-)
Martin Honnen <ma*******@yahoo.de> wrote in message

news:<40********@olaf.komtel.net>...
gekoblu wrote:
Hi!, I want to fix via javascript the combo width to a fix value. I'd
like to implement a kind of ALT / TITLE function to show the entire
option when the text is longer than the combo width...
It's possible?!?


You can set the width with CSS, you can set the title attribute as a
property with javascript:

<html lang="en">
<head>
<title>setting title of select element</title>
<script type="text/javascript">
function setTitleToSelectedText (select) {
if (select.selectedIndex > -1) {
select.title = select.options[select.selectedIndex].text;
}
}
</script>
<style type="text/css">
select {
width: 100px;
}
</style>
</head>
<body>
<form name="formName" action="">
<p>
<select name="select1" onchange="setTitleToSelectedText(this);">
<option>option 1 option 1 option 1</option>
<option>option 2 option 2 option 2</option>
<option>option 3 option 3 option 3</option>
</select>
</p>
<p>
<select name="select2" onchange="setTitleToSelectedText(this);" size="3"> <option>option 1 option 1 option 1</option>
<option>option 2 option 2 option 2</option>
<option>option 3 option 3 option 3</option>
</select>
</p>
</form>
<script type="text/javascript">
setTitleToSelectedText(document.forms.formName.ele ments.select1);
setTitleToSelectedText(document.forms.formName.ele ments.select2);
</script>
</body>
</html>

Note however that IE/Win doesn't support this (title attribute/property
of <select> elements), but Mozilla, Netscape 6/7, Opera 7 do

Jul 23 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.