SELECT OPTION and width

[msaladin]

Hi all,

I'd like to create a very small menu (when collapsed), but when you
click on it, the OPTION entries should have a wide enough size to show
everything. Actually, it should look like this:

--------- ------- --------------------------
Textbox - - ... - - Another textbox -
--------- ------- --------------------------
- Option 1 Should be longer than -
- Option 2 Should be longer .... -
----------------------------------

I can do this in firefox when I set the CSS width-attribute for the
SELECT tag, but not for the OPTION tag. Firefox correctly creates a
small SELECT-BOX, and when you click on it, you see the long OPTION
entries in the expanded field. IEXPLORER does recognize the width-
attribute for the SELECT box, but then inherits the width to all the
OPTION tags below, therefore the OPTIONS are truncated. The above
SELECT box should just help the users to enter something in the
textfield (e.g. when the user selects an item from the SELECT box, the
value is inserted in the textfield on the left of the SELECT box).

Is there any way to do this, without hacking with Javascript on
onMouseDown and onMouseUp etc... I don't want to try to reprogram the
whole SELECT mechanism in Javascript, but it would be great if this
was possible.

Thanks for your help

 

[Jukka K. Korpela]

Scripsit msaladin:

I'd like to create a very small menu (when collapsed), but when you
click on it, the OPTION entries should have a wide enough size to show
everything.

It's a much better idea to make all the alternatives visible immediately.

Actually, it should look like this:

--------- ------- --------------------------
Textbox - - ... - - Another textbox -
--------- ------- --------------------------
- Option 1 Should be longer than -
- Option 2 Should be longer .... -
----------------------------------

That does not explain much. Why don't you post the URL of the current page,
for a starter? Surely you have created a working, tested page before
considering optional presentational nuances, haven't you?

I can do this in firefox when I set the CSS width-attribute for the
SELECT tag, but not for the OPTION tag. Firefox correctly creates a
small SELECT-BOX, and when you click on it, you see the long OPTION
entries in the expanded field. IEXPLORER does recognize the width-
attribute for the SELECT box, but then inherits the width to all the
OPTION tags below, therefore the OPTIONS are truncated.

That does not explain much.

The above
SELECT box should just help the users to enter something in the
textfield (e.g. when the user selects an item from the SELECT box, the
value is inserted in the textfield on the left of the SELECT box).

You're playing with scripting, aren't you? But you are not explaining what
you are really doing.

 

[msaladin]

OK I understand my eplanation was a bit clumsy, I have created a small
HTML page with what I want to do. The URL is:

http://www.geocities.com/frombasel2/testselect.html

and I have created screenshots with Firefox and with IExplorer (the
screenshot with firefox is what I actually intend to do):

http://www.geocities.com/frombasel2/firefox.gif
http://www.geocities.com/frombasel2/iexplorer.gif

I tried to work with other CSS classes in the option tag, to no avail.
Thanks for any feedback.

 

[Jukka K. Korpela]

Scripsit msaladin:

OK I understand my eplanation was a bit clumsy,

and you're now not quoting or paraphrasing what you are commenting on.
Please read my previous reply. Then, if problems remain, post a _real_ URL
showing the context, not just an enigmatic, cryptic piece with no apparent
purpose and context. The form hasn't even got a submit button or any
explanation of what it does.

And explain what the *** you are trying to achieve.

 

[Travis Newbury]

And explain what the *** you are trying to achieve.

I have to know, what is the 3 letter word that is so bad that you
could not just type it? Are there really any 3 letter swear words?

 

[Chris F.A. Johnson]

I have to know, what is the 3 letter word that is so bad that you
could not just type it? Are there really any 3 letter swear words?

Those are wildcards and can expand to any number of characters.

 

[msaladin]

I cannot provide you with the real page, because the page works only
in the context of a web-application (which is not available on the
internet). That's the reason I tried to create a HTML page as simple
as possible to provide you guys not with the actual JSP/HTML/
Javascript mess, but with a HTML page where the important facts remain
valid: IExplorer truncates the OPTION-tag to the same width as the
SELECT-tag.

The web-application where I'm using this can initiate some tasks on
servers where an agent is installed. The agent can be installed on 10
servers, or on 1'000 servers, depening on the company that is using
the software. What I want to do is to provide the user with two
different ways to specify on which server he wants to execute a task:

a)
The user knows the servername, he can enter it in the textbox. If the
servername does not match exactly a known servername, the servlet can
try to guess it.

b)
The user does not know the servername, he will use the SELECT-box.
Once the user has selected an OPTION, the OPTION-value is inserted in
the textbox (via Javascript). This select box just shows the user all
valid servers.

So the only reason I need the SELECT-field in this case is to provide
a list with all possible entries for the textbox. If this seems to be
a problem, I could always solve the problem by providing an icon just
after the textbox, and open a new HTML page with a list of all
servers. But just to select a server, this seems to be too cumbersome.

Regards

 

[Jukka K. Korpela]

Scripsit msaladin:

I cannot provide you with the real page,

Or anything really resembling it. But can you learn how to post to Usenet?
Hint: not quoting or paraphrasing _anything_ is not the right way.

the important facts remain
valid: IExplorer truncates the OPTION-tag to the same width as the
SELECT-tag.

Not really. It just ignores your CSS setting for an option element. But if
this is an important fact, why do you insist on creating that problem?

What I want to do is to provide the user with two
different ways to specify on which server he wants to execute a task:

a)
The user knows the servername, he can enter it in the textbox.

Fine, you have a textbox then. For clarity, it is best to keep it on a
separate line in the form, preceded by its label. Don't forget to make it
reasonably wide, since server names can be fairly long, especially if they
are fully qualified domain names.

b)
The user does not know the servername, he will use the SELECT-box.

That may or may not work. If there are 1,000 options, it won't. But by
trying to truncate the width of the select element (at least initially) to
something that cannot possibly contain a typical name, you almost guarantee
that it won't work for 10 options either.

Once the user has selected an OPTION, the OPTION-value is inserted in
the textbox (via Javascript).

Why?? You don't need anything like that. Just pass the choice as a form
field and make the form handler use it. You have the issue of deciding what
to do if a choice has been made (to detect this, the select element should
contain an initially selected option indicating that no choice has yet been
made) _and_ the text input field is not empty. But that's manageable, and
you could even use client-side JavaScript to detect - when possible - this
as soon as the user makes a wrong move.

 

[David Segall]

Scripsit msaladin:


Or anything really resembling it. But can you learn how to post to Usenet?
Hint: not quoting or paraphrasing _anything_ is not the right way.

Could you please rephrase your hint to make it comprehensible to those
of us who have not completed a University course in boolean algebra?

 

[Jonathan N. Little]

Could you please rephrase your hint to make it comprehensible to those
of us who have not completed a University course in boolean algebra?

Okay let's try it in a positive statement:

In Usenet either quote the relevant bits of the message to which you are
replying to or paraphrase it.

 

[David Segall]

Okay let's try it in a positive statement:

In Usenet either quote the relevant bits of the message to which you are
replying to or paraphrase it.

 

[David Segall]

Okay let's try it in a positive statement:

In Usenet either quote the relevant bits of the message to which you are
replying to or paraphrase it.

Thank you Jonathan. You have probably correctly interpreted Mr
Korpela's sentence and you have generously ignored the subtext of
mine.