urgent: Multicolumn select list

Laxmi · Dec 31, 2003

Hi,
I have a select list, which looks like this:
<select multiple size="8" name="SupervisorNames">
<option value="ADAMO,CLAUDIA">ADAMO,CLAUDIA bd2sk9n</option>
<option value="ABRAHAM,JEFFREY">ABRAHAM,JEFFREY
g060812</option></optgroup>
<option value="ACCELERATORS,IH">ACCELERATORS,IH b123456</option>
</select>

Each option in the list shows 2 things: a name and an ID. Since the
names are of different lengths, its not possible to line up the IDs
vertically. What I mean is, I would like the list to look like:

<select multiple size="8" name="SupervisorNames">
<option value="ADAMO,CLAUDIA">ADAMO,CLAUDIA bd2sk9n</option>
<option value="ABRAHAM,JEFFREY">ABRAHAM,JEFFREY
g060812</option></optgroup>
<option value="ACCELERATORS,IH">ACCELERATORS,IH b123456</option>
</select>

I have tried getting the length of the longest name, then appending
(max length - current name length) no. of spaces (i.e.:&nbsp

to each
name, to achieve this. But somehow it does not work, and the IDs do
not line up vertically.
I must have this information in a select list, so something like a
table is not an alternative.
Any help will be much appreciated.

G. Doucet · Dec 31, 2003

I'm not a regular here, but since there was no reply yet...

This is as close as I could get it, though I'm sure there must be a better
way!

I hope I understood what you meant.

Guy Doucet

<HTML>
<HEAD>
<STYLE TYPE='text/css'>
BODY {font-family: Courier}
SELECT {font-family: Courier}
</STYLE>
</HEAD>
<BODY>
Testing

<select multiple size="8" name="SupervisorNames">
<option value="ADAMO,CLAUDIA" >ADAMO........,CLAUDIA....bd2sk9n</option>
<option value="ABRAHAM,JEFFREY">ABRAHAM......,JEFFREY....g060812</option>
<option value="ACCELERATORS,IH">ACCELERATORS.,IH.........b123456</option>
</select>

</BODY>
</HTML>

Toby A Inkster · Dec 31, 2003

Laxmi said:
I must have this information in a select list, so something like a
table is not an alternative.

You could try setting a "font-family:monospace;" CSS rule on the select
element (and the options within!) but this will only work some of the time.

What's wrong with just putting the IDs in square brackets?

<select multiple size="8" name="SupervisorNames">
<option value="ADAMO,CLAUDIA">ADAMO,CLAUDIA [bd2sk9n]</option>
<option value="ABRAHAM,JEFFREY">ABRAHAM,JEFFREY [g060812]</option>
<option value="ACCELERATORS,IH">ACCELERATORS,IH [b123456]</option>
</select>

It's not quite what you wanted, but it should be clear enough for the
users.

G. Doucet · Dec 31, 2003

I just thought that if the ID numbers are all the same length, or if they
can have leading zeros, you could display your select list with the ID
numbers first. But perhaps that may not look quite as good.

bd2sk9n ADAMO,CLAUDIA
g060812 ABRAHAM,JEFFREY
b123456 ACCELERATORS,IH

Also, if the selected options will be submitted to a script you are writing,
and you are only including the ID numbers in the select list for your script
and not for the user, you could remove them from the list and have them as
the values, if that will work...

<option value="bd2sk9n">ADAMO,CLAUDIA</option>
<option value="g060812">ABRAHAM,JEFFREY</option>
<option value="b123456">ACCELERATORS,IH</option>

I'll shut up now!

Laxmi · Jan 2, 2004

thanks everyone for the great suggestions. I'm sure I can use atleast
one of them. Happy new Year.
-Laxmi

Toby A Inkster said:
Laxmi said:

I must have this information in a select list, so something like a
table is not an alternative.

Click to expand...

You could try setting a "font-family:monospace;" CSS rule on the select
element (and the options within!) but this will only work some of the time.

What's wrong with just putting the IDs in square brackets?

<select multiple size="8" name="SupervisorNames">
<option value="ADAMO,CLAUDIA">ADAMO,CLAUDIA [bd2sk9n]</option>
<option value="ABRAHAM,JEFFREY">ABRAHAM,JEFFREY [g060812]</option>
<option value="ACCELERATORS,IH">ACCELERATORS,IH [b123456]</option>
</select>

It's not quite what you wanted, but it should be clear enough for the
users.

Consistent control for visible elements in <option></option>	1	Aug 16, 2022
How to display input options only after selecting an option from the 'select class' tag JS?	6	May 12, 2023
I dont get this. Please help me!!	2	Jan 24, 2023
Select files based on text list of filenames(part of the name:date) with condition	0	May 4, 2022
Select Eof extension files based on text list of filenames with if condition	0	May 4, 2022
Select List transfer to another List with array	0	Apr 20, 2012
Multiple select horizontal and veritical scroll bar	7	Sep 29, 2010
<select: list of images?	6	Jun 29, 2008

urgent: Multicolumn select list

Laxmi

G. Doucet

Toby A Inkster

G. Doucet

Laxmi

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads