I am porting my *nix POS restaurant from command line version to web version (once it become stable, I would clear up the code and release it as GPL or MPL soon).
In order to change the work area to desk 7. The command line version would have to type 07[enter], the web version would accept both 07[enter] or 7[desk]. The desk key is in fact the numlock mapped as a comma (keyCode==188). You can see it as 7[comma]. The javascript would take care of the value transformation.
The problem is that when the value of the text field change from "7" to "07", it would appear as "07," or "07" for a very short time.
- I would like only "7" appear in the field while submitting, it is also ok if the value is not visible temporary
- if change the type from "text" to "hidden", it would just disappear and the layout changed
How can I change the value without trace while submitting?
Note: this program use firefox as front end, cache, history, form, saved password all disabled.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>
</title><link rel="stylesheet" href="/css/david.css" type="text/css"/></head>
<body onload="javascript
:document.cmd.cmd.focus()">
<h1>Program in development</h1><br/>
<script language="javascript" type="text/javascript">
function desknum(event) {
if (event.keyCode==188) {//desknum
if (document.cmd.cmd.value.match(/^\d{1,5}$/i)) {
document.cmd.cmd.value="0"+document.cmd.cmd.value;
document.cmd.submit();
document.cmd.cmd.disabled=true;
}}}
</script>
<form name="cmd" action="?dsk=7" method="post">
desk 7: <br/><input name="cmd" class="cmd" type="text" onkeydown="desknum(event)"/>
</form><script>
setTimeout("window.location='?dsk=None'",180000)
</script>
<table>
<tr class="header"><td/>Qty<td/>Descriptions<td/>Price<td/>Recod</tr><tr class="r0"><td/>1<td/><small>5 </small>GAMBAS FRITAS<td/>5.95<td/>01:30</tr>
</table>
<br/>Desk 7:<br/>base 5.56 + tax 0.39 = 5.95<br/>
</body>
</html>
-david.css-
body {
font-family: sans-serif, Helvetica, Geneva, Arial, SunSans-Regular;
color: black;
background:#FFFFFF}
div.navtext {
padding-left: 11em;}
ul.navbar {
position: absolute;
top: 2em;
left: 1em;
width: 9em;
list-style-type: none;
padding: 0;
margin: 0;}
ul.navbar li {
background: #DDDDFF;
margin: 0.5em 0;
padding: 0.3em;
border-top: 1px solid blue;
border-bottom: 1px solid blue;}
ul.navbar a {
text-decoration: none }
a:link, a:visited {
color: #000000;
font-weight: bold;
text-decoration: none}
a:hover {
color: white;
font-weight: bold;
background: black}
a:active {
color: white;
font-weight: bold;
background:#663366}
small {
color: #663366}
table {
border-collapse: collapse;
border: 3px solid #663366}
tr {
padding: 2em;
border-bottom: 1px solid #663366;
vertical-align:text-top;}
.header {
color: white;
font-weight: bold;
background: #663366}
.r0 {
background: #DDDDDD}
.r1 {
background: #EEEEEE}
td {
border-bottom: 1px solid #663366;
border-left: 1px dotted #663366;
border-right: 1px dotted #663366;
padding-left: 3px;
padding-right: 3px}
input {
border: 1px solid #663366;
padding: 8px;
font-weight: bold;}
.cmd {
font-size: 20px;}
.form {
padding: 3px;
margin-left: 11em;}
select {
font-size:12px;}
