Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations TouchToneTommy on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

select box that can also take new input

Status
Not open for further replies.

rhull

Programmer
May 23, 2001
46
US
Is there a way for a select box to allow the user to still type in a value if none of the option will suffice?

I dont think there is, but I still want to double check.

-Thanks!
R
 
You could do it with something like this:

<html>
<head>
<title>test</title>
<Script Language=&quot;JavaScript&quot;>
<!--
function trim(string)
{
fixedTrim = &quot;&quot;;
lastCh = &quot; &quot;;

for (x = 0; x < string.length; x++)
{
ch = string.charAt(x);
if ((ch != &quot; &quot;) || (lastCh != &quot; &quot;))
{
fixedTrim += ch;
}
lastCh = ch;
}

//alert('Before:' + fixedTrim - 1);
if (fixedTrim.charAt(fixedTrim.length - 1) == &quot; &quot;)
{
fixedTrim = fixedTrim.substring(0, fixedTrim.length - 1);
// alert('After:' + fixedTrim);
}

if(fixedTrim == '')
{
//alert('Please enter a color.');
}
else
{
nameditem = fixedTrim;
insert(nameditem);
//return fixedTrim;
}
}

function insert(nameditem)
{
if (document.frmTest.txt1.value != '' || ' ')
{
var newOption = document.createElement(&quot;OPTION&quot;);
newOption.text = nameditem;
newOption.value = nameditem;
document.frmTest.select1.add(newOption);
document.frmTest.txt1.value = &quot;&quot;;
document.frmTest.txt1.focus();
}
else
{
alert('Please insert a value.');
}
}
function colors(selCol)
{
document.bgColor = selCol;
}
//-->
</Script>
</head>
<body>
<Form name=&quot;frmTest&quot;>
<input type=text value='' name=&quot;txt1&quot;>
<input type=button value=insert onclick=&quot;JavaScript:trim(txt1.value);document.frmTest.txt1.focus();&quot;>
<br>
<select name=&quot;select1&quot; onChange=&quot;colors(this.value);document.frmTest.txt1.focus();&quot; STYLE=&quot;WIDTH: 205px;&quot;>
<Option><------Choose Here-------></Option>
</select>
</Form>
</body>
</html>
 
I should be able to make that work, but I figured it would be a workaround.

Thanks!
-R
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top