Listbox and textbox help

**benslayton** · 01-15-2007, 08:30 PM

instead of "place1,place2, and place3 the showing up in the text box. I actually want a small description to go in the textbox instead of what is in the listbox.

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<SCRIPT>  
<!--  
  
function combotext_onkeydown(e,oText,oSelect){  
  
  keyCode = e.keyCode;  
  
  if (keyCode == 40 || keyCode == 38) {  
    oSelect.style.display = 'block';  
    oSelect.focus();  
    comboselect_onchange(oSelect, oText);  
  }  
  else if (keyCode == 13) {  
    e.cancelBubble = true;  
    if (e.returnValue) e.returnValue = false;  
    if (e.stopPropagation) e.stopPropagation();  
    comboselect_onchange(oSelect, oText);  
    oSelect.style.display='none';  
    oText.focus();  
    return false;  
  }  
  else if(keyCode == 9) return true;  
  else { //alert(keyCode);  
  
    oSelect.style.display = 'block';  
  
    var c = String.fromCharCode(keyCode);  
    c = c.toUpperCase();   
    toFind = oText.value.toUpperCase() + c;  
  
    for (i=0; i < oSelect.options.length; i++){  
       nextOptionText = oSelect.options.text.toUpperCase();  
  
        if(toFind == nextOptionText){  
            oSelect.selectedIndex = i;  
            break;  
        }  
  
        if(i < oSelect.options.length-1){  
           lookAheadOptionText = oSelect.options[i+1].text.toUpperCase() ;  
           if( (toFind > nextOptionText) &&   
              (toFind < lookAheadOptionText) ){  
              oSelect.selectedIndex = i+1;  
              break;  
           }  
         }  
         else {  
           if(toFind > nextOptionText){  
               oSelect.selectedIndex = oSelect.options.length-1; // stick it at the end  
               break;  
           }  
       }  
    }  
  }  
}  
  
  
function comboselect_onchange(oSelect,oText) {  
  if(oSelect.selectedIndex != -1)  
    oText.value = oSelect.options[oSelect.selectedIndex].text;  
}  
  
function comboselect_onkeyup(keyCode,oSelect,oText){  
  if (keyCode == 13) {  
    comboselect_onchange(oSelect, oText);  
    oSelect.style.display='none';  
    oText.focus();  
  }  
}  
  
// -->  
</SCRIPT>
<body>
<FORM name="form1">
  <table width="617" border="1" align="center" bordercolor="#990000">
    <tr>
      <th scope="col">Places</th>
      <th scope="col">Description</th>
    </tr>
    <tr>
      <th width="219" scope="row"> <SELECT NAME="selectInput1" SIZE="8" ONCHANGE="comboselect_onchange(this, this.form.textInput)" >
        <option>place1</option>
        <option>place2</option>
        <option>place3</option>
		
        </SELECT>		</th>
      <th width="382" scope="row"> 
          <textarea name="textInput" cols="20" rows="10" id="textInput"></textarea>        </th>
    </tr>
  </table>
</FORM>
</BODY>
</html>

Any Help?

**jscheuer1** · 01-15-2007, 10:28 PM

You could give each option a value attribute and pull options.value instead of options.text.

**benslayton** · 01-16-2007, 03:02 AM

Originally Posted by jscheuer1

You could give each option a value attribute and pull options.value instead of options.text.

I changed that in the script tags but that didnt do any good. It still does the same thing.

**jscheuer1** · 01-16-2007, 05:10 AM

I don't think you understood me. This demo shows that the value may be retrieved instead of the text and that the value may be completely different than the text:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>Select Options Value - Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function demo(el){
alert(el.options[el.selectedIndex].value)
}
</script>
</head>
<body>
<select name="selectInput1" onchange="demo(this)" >
        <option value="A longer description of Place 1">place1</option>
        <option value="The movie version of a longer description of Place 2">place2</option>
        <option value="Bob's your Uncle's longer description of Place 3">place3</option>
</body>
</html>

**benslayton** · 01-16-2007, 06:19 AM

sorry but I dont understand how to make the description show up in a textbox and not an alert box.

**jscheuer1** · 01-16-2007, 08:25 AM

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>Select Options Value to Textarea - Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
function demo(el){
el.form.textInput.value=el.options[el.selectedIndex].value;
}
</script>
</head>
<body>
<form action="">
<table>
<tr>
<td><select name="selectInput1" onchange="demo(this)">
        <option value="A longer description of Place 1">place1</option>
        <option value="The movie version of a longer description of Place 2">place2</option>
        <option value="Bob's your Uncle's longer description of Place 3">place3</option>
</select></td>
<td><textarea name="textInput" cols="30" rows="5">A longer description of Place 1</textarea> </td>
         </tr>
         </table>
         

</form>
</body>
</html>

**benslayton** · 01-17-2007, 01:57 AM

Gracious, Senor!!!

Thread: Listbox and textbox help

Thread Tools

Search Thread

Listbox and textbox help

Bookmarks

Bookmarks

Posting Permissions