Good Day!
I created a webpage and it consist of Username, Department, and a submit button. the username is a textfield type and the department is a select option type. I want that when i am done in inputting my username and i press the enter, the select option would be hide so that i can choose my department and when i am done in choosing my department and i press the enter i automatically link to the my designated department. I hope you can help me in my problem
Here is my code:
<head>
<script>
function onKeyEnter(e) {
var ENTER_KEY = 13;
var code = "";
if (window.event){ // IE
code = e.keyCode;
}else if (e.which){ // Netscape/Firefox/Opera
code = e.which;
}
if (code == ENTER_KEY) {
formname.select.focus()
}
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
BODY {
background-image: url(layout_image/bgroundv03.png);
background-attachment: fixed;
}
#Layer1 {
position:absolute;
width:200px;
height:115px;
z-index:1;
left: 82px;
top: 95px;
}
#Layer2 {
position:absolute;
width:229px;
height:49px;
z-index:1;
left: 441px;
top: 262px;
}
#Layer3 {
position:absolute;
width:186px;
height:32px;
z-index:2;
left: 452px;
top: 275px;
}
#Layer4 {
position:absolute;
width:82px;
height:35px;
z-index:3;
left: 516px;
top: 320px;
}
#Layer5 {
position:absolute;
width:60px;
height:29px;
z-index:4;
left: 524px;
top: 328px;
}
#Layer6 {
position:absolute;
width:130px;
height:55px;
z-index:5;
left: 311px;
top: 210px;
}
#Layer7 {
position:absolute;
width:230px;
height:46px;
z-index:6;
left: 441px;
top: 216px;
}
#Layer8 {
position:absolute;
width:200px;
height:115px;
z-index:7;
left: 45px;
top: 100px;
}
#Layer9 {
position:absolute;
width:59px;
height:28px;
z-index:7;
left: 70px;
top: 96px;
}
#Layer10 {
position:absolute;
width:216px;
height:30px;
z-index:7;
left: 453px;
top: 228px;
}
-->
</style>
</head>
<body>
<form id="form1" name="form1" method="post" action="loginv02.php">
<div id="Layer3">
<select name="department">
<option>Choose your Department. . . . . . </option>
<option value="Accounting" <?php if($_POST['department'] == 'Accounting') echo "selected='selected'"; ?>>Accounting</option>
<option value="Engineering" <?php if($_POST['department'] == 'Engineering') echo "selected='selected'"; ?>>Engineering</option>
<option value="Finishing_Goods" <?php if($_POST['department'] == 'Finishing_Goods') echo "selected='selected'"; ?>>Finishing Goods</option>
<option value="HRAD" <?php if($_POST['department'] == 'HRAD') echo "selected='selected'"; ?>>HRAD</option>
<option value="MIS" <?php if($_POST['department'] == 'MIS') echo "selected='selected'"; ?>>MIS</option>
<option value="Packaging_and_Design" <?php if($_POST['department'] == 'Packaging_and_Design') echo "selected='selected'"; ?>>Packaging and Design</option>
<option value="Production" <?php if($_POST['department'] == 'Production') echo "selected='selected'"; ?>>Production</option>
<option value="Purchasing_Logistic" <?php if($_POST['department'] == 'Purchasing_Logistic') echo "selected='selected'"; ?>>Purchasing and Logistics</option>
<option value="QA_and_Technical" <?php if($_POST['department'] == 'QA_and_Technical') echo "selected='selected'"; ?>>QA and Technical</option>
<option value="Supply_Chain" <?php if($_POST['department'] == 'Supply_Chain') echo "selected='selected'"; ?>>Supply Chain</option>
</select>
</div>
<div id="Layer5">
<input type="submit" name="Submit" value="Submit" />
</div>
<div id="Layer2"><img src="layout_image/subframev02.png" width="229" height="50" /></div>
<div id="Layer4"><img src="layout_image/subframev02.png" width="80" height="46" /></div>
<div id="Layer6"><img src="layout_image/userv01.png" width="131" height="62" /></div>
<div id="Layer7"><img src="layout_image/subframev02.png" width="229" height="50" /></div>
<div id="Layer10">
<input name="username" type="text" size="30" id="username" />
<?php
if(isset($err)) {
echo $err;
}
?>
</div>
</form>
</body>
</html>