Allows you to modify the text value of a SELECT menu option. Upon selecting the option, if it is set as editable, a cursor will appear. To edit the option, simply type, and press enter when finished (To bring back the old value, just hit enter.) You can also define any option as "read-only".
Known bugs:
Netscape
Typing does nothing if mouse is over the menu.
Shift, delete, and the directionals do not work properly.
Spacebar creates a space, but also scrolls the page if possible.
Internet Explorer 5.0
The backspace button works like a BACK button.
Spacebar creates a space, but also scrolls the page if possible.
Add the below code to the <body> section of your page:
<scriptlanguage="javascript"type="text/javascript"> /* Visit http://www.yaldex.com/
for full source code
and get more free JavaScript, CSS and DHTML scripts! */
<!-- Begin var
o =null; var
isNN =(navigator.appName.indexOf("Netscape")!=-1); function
beginEditing(menu){ finish(); if(menu[menu.selectedIndex].value!="read-only"){ o =newObject(); o.editOption
=
menu[menu.selectedIndex]; o.editOption.old
=
o.editOption.text; o.editOption.text="_"; menu.blur(); window.focus(); document.onkeypress=
keyPressHandler;
} function
keyPressHandler(e){ var
option =
o.editOption; varkeyCode=(isNN)?
e.which:event.keyCode; if(keyCode==8||keyCode==37) option.text=
option.text.substring(0,option.text.length-2)+"_"; elseif(keyCode==13){ finish();
}else option.text=
option.text.substring(0,option.text.length-1)+String.fromCharCode(keyCode)+"_"; status=keyCode;
} function
finish(){ if(o
!=null){ option =
o.editOption; if(option.text.length>1) option.text=
option.text.substring(0,option.text.length-1); else option.text=
option.old; document.onkeypress=null; o =null; } }
} // End --> </script> <form>
<selectonChange="beginEditing(this);"size=7>
<optionvalue="read-only">Select
an option to edit it.</option>
<optionvalue="read-only">
---------------------------- </option>
<optionvalue="last">SurName</option>
<optionvalue="first">FirstName</option>
<optionvalue="email">Email</option>
<optionvalue="add1">Address
1</option>
<optionvalue="add2">Address
2</option>
</select>
</form> <tableborder=1width=500>
<tr><td> <b>Known
bugs:</b><br>
Netscape <ul>
<li>Typing
does nothing if mouse is over the menu.</li>
<li>Shift,
delete, and the directionals do not work properly.</li>
<li>Spacebar
creates a space, but also scrolls the page if possible.</li>
</ul> Internet Explorer 5.0 <ul>
<li>The
backspace button works like a BACK button.</li>
<li>Spacebar
creates a space, but also scrolls the page if possible.</li>
<ul> </td></tr>
</table>
