Hi,
When constructing a drop-down box in a Maintain HTML grid, the width is set to the width of the longest string. I wish to set the width to conform to the other drop-downs on that page. When viewing the width should expand to show the complete list.

Any suggestions?

Thank you,
Nick

This message has been edited. Last edited by: Kerry,

This is not really a maintain question, but more an html question.
You can set the width of any combobox by means of using the style= command. But that's it. When you click on it, it will stay the width you specified.

Hey Nick
What object are you working with? The HTMLTable or the Active-X Grid in 7.6?
Mark

Hey Mark,
I have an HTMLTable with 16 columns. Col 1 is the row description, cols 2-15 user selected time for 2 weeks and col 16 is the total. One row the user will select one of 16 text descriptions. The radio button solution works for all other data entry but is a little messy here. The drop-down solution works but I need to keep the columns from running off the right side of the page. Hence the need to retain the original column width.
Any ideas?
Thank you,
Nick

In one of my maintains I have dropdown boxes in an html table. The code to fill one of my dropdowns looks like:

compute sel_a = if stk_804(i).clusterk eq 'A' then 'selected' else ' ';
compute sel_b = if stk_804(i).clusterk eq 'C' then 'selected' else ' ';
compute sel_c = if stk_804(i).clusterk eq 'D' then 'selected' else ' ';
compute sel_d = if stk_804(i).clusterk eq 'O' then 'selected' else ' ';
compute sel_e = if stk_804(i).clusterk eq 'P' then 'selected' else ' ';
compute sel_f = if stk_804(i).clusterk eq 'S' then 'selected' else ' ';
compute sel_g = if stk_804(i).clusterk eq ' ' then 'selected' else ' ';
Compute stk_select(i).clk_veld = "<select name=clk_fld_sel" | i | " style='width:110px;' size=1>" |
 "<option value='A' " | sel_a || ">Option A</option>" |
 "<option value='C' " | sel_b || ">This is option C</option>" |
 "<option value='D' " | sel_c || ">Also option D is great</option>" |
 "<option value='O' " | sel_d || ">Do not select option O</option>" |
 "<option value='P' " | sel_e || ">Production</option>" |
 "<option value='S' " | sel_f || ">Option S</option>" |
 "<option value=' ' " | sel_g || ">This one is empty</option></select>";

Not every option will fit in the 110 pixels, but the size of the box is limited to this 110.
I've searched for some possibility of extending the size of the combobx only when selected, but there just isn't something like that for standard comboboxes. You can define your own combobox implementation, but for me this would go a bit too far. I didn't go that way, I just stayed with the above method.

Hi GamP,
Thanks for the help which took care of the initial layout issue. But as you point out when selecting the combo box the options are not expanded to display the full text. This seems like a relatively straight forward option available in many other products including MS Access, ASP, etc.

Any ideas to expand the text when the combo box is expanded?

Thank you,
Nick

Nick
This works, but it's not very pretty. The onClick event add to the code expands the box and the onBlur shrinks it. But you have to tab away for the blur trigger to fire. Maybe there is a better even than blur. See what you can find.

Mark

  
  Compute Stk(I).lbox/a450 = 
  "<select name=list " || I || " STYLE= 'width: 50px'; onClick='document.Form1.list " || I || ".style.width = 300; ' onBlur='document.Form1.list " || I || ".style.width = 50;'>" | 
		"  <option value='  '>   </option> 		"  |
		"  <option value='G'>	G</option> 		"  |
		"  <option value='NR' selected>	NR</option> 	"  |
		"  <option value='PG'>	PG</option> 	"  |
		"  <option value='PG13'>PG13</option> 	"  |
		"  <option value='R'>	R</option> 		"  |
		"  <option value='Q'>	TEST FOR LENGTH</option> 		"  |
		"  </select>"

quote:

available in many other products including MS Access, ASP, etc.

These are not the normal out-of-the-box comboboxes. They have been custom created by means of VB or some such language. But if you (have to) rely on the good old BG comboboxes, they will not expand, unless you code it somewhat like Mark showed. And if you do that then the entire combobox gets resized, not just the part where you can select something. That probably means that also the rest of the screen shifts to the right until the selection is made after which the entire screen shifts left again.
There are nice looking combobox implementations that will allow what you want, but that involves implementing a custom-combobox solution. If you search the internet for resizing a combobox, you'll find a number of those custom solutions.

Hi,

Tried Mark's technique but got the following error message in lower left corner of screen: "document.Form1.list_assgn3.style is null or not an object. I must be doing something wrong but can not find it. The code is as follows:

"<select name=list_assgn " ||j||" style='width:50px'; onClick='document.Form1.list_assgn " ||j|| ".style.width = 150; ' onBlur='document.Form1.list_assgn " ||j|| ".style.width = 50;'>" |
 "<option value=' '> </option> " |
 "<option value='Special Project1'>Special Project1</option> " |
 "<option value='Special Project2'>Special Project2</option> " |
 "<option value='Leaks and Ceiling Repairs'>Leaks and Ceiling Repairs</option> " |
 "</select>";

Any ideas?

Thank you,
Nick

Only thing that comes to my mind at this point is to ask if your form is indeed also called Form1?
Does the error happen for number 3 only or also for the other ones?

Oh, this code

style='width:50px';

actually should read

style='width:50px;'

but that's not the cause of the error.

Hi GamP,
Placing semi-colon after single quote gives: missing ';' error message. The Maintain first initializes the HTMLTable then collects DB record info and sets the "select" values. The "3" stands for the third row of this HTMLTable, the initialization setting. Form1 has six HTMLTables. This is HTMLTable6.

So, the current status is setting the width to 50 px, as you initially suggested works but the users can not view the complete description. All variations of the onCLick.onBlur settings give an error when the form is produced and do not function as suggested.

Again, I must be doing something wrong but can not see the error. Maybe, I'm too close to it.

With the exception of a few meetings, I will be working on this project all day and can try any suggestions.

Thank you,
Nick

Nick
When Form1 is displayed is this HTMLTable visible? The error could be that the table is not displayed on the screen? I would break the line down in pieces to debug. Post the entire loop and I will try to cut / paste and debug.

Mark

May I come up with a different solution.

Rather than trying to manipulate the combo, which is messy and causes issues with the cells, use the combo with either a single value from the db or blank, kept to the narrow width required.

Create a single listbox with the select items from the combobox, and this can be the width you want. Keep off table and hide. For the combo and listbox add an onclick event.

When the combo is clicked:
1)get the cell position. Plenty of examples on Google.
2)move the listbox into position under the cell
3)blur combo

When listbox is clicked:
1)copy selected item to the combo
2)move listbox and hide

This should be a clean solution, with less data on the form, as the selects are all in one listbox.