View Full Version : Basic Editable Combo Box

01-29-2004, 06:54 PM


Here is a very basic simulated editable combo box for quick and dirty uses.

After any text input on a form you simply add a...


You must give the input an id as well as a name. They don't have to be the same thing, but its recommended.

NS broke when I was cleaning up the code. Searching for the error.

01-29-2004, 07:00 PM
Does not work in Gecko

01-29-2004, 07:17 PM
Sweet, I have a major design flaw that I found. Doesn't work in gecko. Positioning is off.

01-29-2004, 07:18 PM
Have you tried the TypeAheadCombo class (http://www.codingforums.com/showthread.php?s=&postid=156759#post156759) I developed based on some great work by glenngv? It just uses a normal <select> element, and can accept a single new value as the first option.

Check it out; it may do the trick you're looking for.

02-12-2004, 06:51 PM
I haven't done much work with HTC's (Hyper Text Components), but I found a pretty sweet component that does exactly what you're thinking of, but it looks really nice too.

Here's the link:

I'm currently trying to figure out how to incorporate another feature of the select component: the value attribute of each option. When used in a form, this HTC seems to merely pass the value of text in the variable on submit -- treating it just like a textbox.

I don't know if there is a fix for this, but one would be much appreciated.

Thanks & Enjoy,

02-13-2004, 03:40 AM
The problem with that code is that it only works in IE so it has very limited support. Unlike the update that Choopernickel made in my original work, which has a wider support (IE5+, NS6+, Moz1+ among others)

02-13-2004, 04:11 AM
I suppose...

But I'm currently creating an application for a company that will run on its intranet, and all machines are windows -- hence, all users will use IE to connect to the application.

In my environment, presentation is very key, and this HTC provides almost exactly what I'm looking for. Except, of course, the fact that it's missing the value attribute...

But I do see your point. However, if you can guarantee your users will be using IE, this is a very nice option.

Again, if anyone can figure out how to get the value attribute of the select box to carry through, I'd really appreciate your help.


02-13-2004, 04:47 AM
It is said in the link you posted that you access the value in javascript as:


But if you mean, it doesn't pass the selected option value in the server, the html source of that page does specify the value, though the same with the text.

<form id=form1>
<DEADBEEF:COMBOBOX size="44" name="server" id=server>
<option selected value="deadbeef.com">deadbeef.com
<option value="microsoft.com">microsoft.com
<option value="sageconspiracy.com">sageconspiracy.com
<br><input type=submit>(Look at the url in your address bar after you press submit.)

02-13-2004, 06:16 AM
I don't get it..

My problem is that the variable passed over to my php page doesn't hold the value, it holds the text.

So yea, I'm sure that using Javascript I could see the value, however, once the form is submitted to the server, the variable in the $_POST array holds the text value -- NOT the value.

Now I'm not sure if you answered my question in your previous post glenngv, but I hope I've made my problem more clear.

Thanks again,

02-16-2004, 03:08 AM
Ok, if that is the case then just create a hidden field that will hold the value of the selected option. Since javascript can access the "value", you can set the value of the hidden field when the submit button is clicked and then in PHP, access that hidden field instead of the combobox itself.

02-16-2004, 03:53 AM

thanks for your short-circuit solutions. However, I'm going to need a proper solution since my application is slightly more complicated (dynamic variables and form elements...), and the short-circuit solutions won't work.

I've contacted the guy from deadbeef.com to see if he can aid me.

If anyone else has any experience with HTCs, I'd appreciate your help as well.


02-17-2004, 02:54 PM
You have two cares, apparently: functionality and presentation. These are of course good cares to have- yet you must decide which of the two is most important.

TypeAheadCombo will submit the <option> value, either if it is not enabled to accept new values, or if a new value is not typed. If a new value is typed, there's only one context which must be dealt with: the new <option>'s text, which is set to the same as the value, as the typing happens.

If your primary concern is a flashing cursor, I'm sure somebody can come up with a way to add one in to the TypeAheadCombo class.

Here's a quite complex form with TypeAheadCombo in action, and the instantiation is (of course) no more difficult than ever: http://www.10mar2001.com/temp/formUI/index.html . There's no form too complex for this script.

02-17-2004, 06:44 PM
Or, you could code your own and get an education in the proccess. My code barely works in general, but on my IE platform and design it works great. If I have time become available, I'll modify it for cross compliance.