dougcranston
Technical User
Trying to create a script to allow designated users to mock up a customer receipt. User problem is due to state laws, certain wording is required. So up till now, users submit text to our developer, he codes it, and then prints a copy and takes it back to the user. User has no concept of Receipt printer 40 chars normal type, 20 chars big type etc.
This results in alot of back in forth.
I volunteered to try and create a web page to allow the user to mockup the receipt so they can visually see a "representation" of what the receipt layout would look like. (Representation as the receipt printers builtin fonts are not Windows fonts so at best they would get the general look n feel.)
Users can have up to 15 lines of text.
I was trying to use a textarea box to represent the receipt tape.. I created the following test script with 3 inputs with plans to expand to the 15, but it doesn't work.
Only the last input box actually posts to the textarea.
I know I am doing something really stupid or overlooking the obvious, but I just can't see it.
Any suggestions would be greatly appreciated.. May be a different approach.
Thanks for your time and consideration.
Dougc
Sample code is as follows:
<%@ Language=Javascript %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<link rel="stylesheet" type="text/css" href="/tmp/tst.css">
<script>
function validchk() {
if(document.FORM1.strMaxLen1[1].checked==true) {
var length = '20';
document.FORM1.strText1.maxLength='20';
document.FORM1.strText1.className='lftNormal';
var chgLength = new String(document.FORM1.strText1.value);
document.FORM1.strText1.value=chgLength.substr(0,20);
document.FORM1.strSample.value=chgLength.substr(0,20) + "\r\n";
document.FORM1.strSample.className='ctrBig';
}
else {
var length = '40';
document.FORM1.strText1.maxLength='40';
document.FORM1.strText1.className='lftNormal';
var chgLength = new String(document.FORM1.strText1.value);
document.FORM1.strSample.value=chgLength + "\r\n";
document.FORM1.strSample.className='lftNormal';
//return true;
}
if(document.FORM1.strMaxLen2[1].checked==true) {
var length = '20';
document.FORM1.strText2.maxLength='20';
document.FORM1.strText2.className='lftNormal';
var chgLength = new String(document.FORM1.strText2.value);
document.FORM1.strText2.value=chgLength.substr(0,20);
document.FORM1.strSample.value=chgLength.substr(0,20) + "\r\n";
document.FORM1.strSample.className='ctrBig';
}
else {
var length = '40';
document.FORM1.strText2.maxLength='40';
document.FORM1.strText2.className='lftNormal';
var chgLength = new String(document.FORM1.strText2.value);
document.FORM1.strSample.value=chgLength + "\r\n";
document.FORM1.strSample.className='lftNormal';
//return true;
}
if(document.FORM1.strMaxLen3[1].checked==true) {
var length = '20';
document.FORM1.strText3.maxLength='20';
document.FORM1.strText3.className='lftNormal';
var chgLength = new String(document.FORM1.strText3.value);
document.FORM1.strText3.value=chgLength.substr(0,20);
document.FORM1.strSample.value=chgLength.substr(0,20) + "\r\n";
document.FORM1.strSample.className='ctrBig';
}
else {
var length = '40';
document.FORM1.strText3.maxLength='40';
document.FORM1.strText3.className='lftNormal';
var chgLength = new String(document.FORM1.strText3.value);
document.FORM1.strSample.value=chgLength + "\r\n";
document.FORM1.strSample.className='lftNormal';
//return true;
}
}
</script>
</head>
<body>
<form action="" name="FORM1" id="FORM1" onSubmit="javascript:validchk();">
<input type='radio' name='strMaxLen1' value='40' onClick="return validchk();">Normal Text (40 Char Max)
<input type='radio' name='strMaxLen1' value='20' onClick="return validchk();">Double Wide (20 Char Max)<br>
<input type='text' name='strText1' id='strText1' size='40' maxlength="40" onKeyUp="return validchk();">
<br>
<input type='radio' name='strMaxLen2' value='40' onClick="return validchk();">Normal Text (40 Char Max)
<input type='radio' name='strMaxLen2' value='20' onClick="return validchk();">Double Wide (20 Char Max)<br>
<input type='text' name='strText2' id='strText2' size='40' maxlength="40" onKeyUp="return validchk();">
<br>
<input type='radio' name='strMaxLen3' value='40' onClick="return validchk();">Normal Text (40 Char Max)
<input type='radio' name='strMaxLen3' value='20' onClick="return validchk();">Double Wide (20 Char Max)<br>
<input type='text' name='strText3' id='strText3' size='40' maxlength="40" onKeyUp="return validchk();">
<br>
<textarea rows="4" cols="40" name="strSample">
</textarea>
<input type="submit" name="Submit">
</form>
</body>
</html>
This results in alot of back in forth.
I volunteered to try and create a web page to allow the user to mockup the receipt so they can visually see a "representation" of what the receipt layout would look like. (Representation as the receipt printers builtin fonts are not Windows fonts so at best they would get the general look n feel.)
Users can have up to 15 lines of text.
I was trying to use a textarea box to represent the receipt tape.. I created the following test script with 3 inputs with plans to expand to the 15, but it doesn't work.
Only the last input box actually posts to the textarea.
I know I am doing something really stupid or overlooking the obvious, but I just can't see it.
Any suggestions would be greatly appreciated.. May be a different approach.
Thanks for your time and consideration.
Dougc
Sample code is as follows:
<%@ Language=Javascript %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<link rel="stylesheet" type="text/css" href="/tmp/tst.css">
<script>
function validchk() {
if(document.FORM1.strMaxLen1[1].checked==true) {
var length = '20';
document.FORM1.strText1.maxLength='20';
document.FORM1.strText1.className='lftNormal';
var chgLength = new String(document.FORM1.strText1.value);
document.FORM1.strText1.value=chgLength.substr(0,20);
document.FORM1.strSample.value=chgLength.substr(0,20) + "\r\n";
document.FORM1.strSample.className='ctrBig';
}
else {
var length = '40';
document.FORM1.strText1.maxLength='40';
document.FORM1.strText1.className='lftNormal';
var chgLength = new String(document.FORM1.strText1.value);
document.FORM1.strSample.value=chgLength + "\r\n";
document.FORM1.strSample.className='lftNormal';
//return true;
}
if(document.FORM1.strMaxLen2[1].checked==true) {
var length = '20';
document.FORM1.strText2.maxLength='20';
document.FORM1.strText2.className='lftNormal';
var chgLength = new String(document.FORM1.strText2.value);
document.FORM1.strText2.value=chgLength.substr(0,20);
document.FORM1.strSample.value=chgLength.substr(0,20) + "\r\n";
document.FORM1.strSample.className='ctrBig';
}
else {
var length = '40';
document.FORM1.strText2.maxLength='40';
document.FORM1.strText2.className='lftNormal';
var chgLength = new String(document.FORM1.strText2.value);
document.FORM1.strSample.value=chgLength + "\r\n";
document.FORM1.strSample.className='lftNormal';
//return true;
}
if(document.FORM1.strMaxLen3[1].checked==true) {
var length = '20';
document.FORM1.strText3.maxLength='20';
document.FORM1.strText3.className='lftNormal';
var chgLength = new String(document.FORM1.strText3.value);
document.FORM1.strText3.value=chgLength.substr(0,20);
document.FORM1.strSample.value=chgLength.substr(0,20) + "\r\n";
document.FORM1.strSample.className='ctrBig';
}
else {
var length = '40';
document.FORM1.strText3.maxLength='40';
document.FORM1.strText3.className='lftNormal';
var chgLength = new String(document.FORM1.strText3.value);
document.FORM1.strSample.value=chgLength + "\r\n";
document.FORM1.strSample.className='lftNormal';
//return true;
}
}
</script>
</head>
<body>
<form action="" name="FORM1" id="FORM1" onSubmit="javascript:validchk();">
<input type='radio' name='strMaxLen1' value='40' onClick="return validchk();">Normal Text (40 Char Max)
<input type='radio' name='strMaxLen1' value='20' onClick="return validchk();">Double Wide (20 Char Max)<br>
<input type='text' name='strText1' id='strText1' size='40' maxlength="40" onKeyUp="return validchk();">
<br>
<input type='radio' name='strMaxLen2' value='40' onClick="return validchk();">Normal Text (40 Char Max)
<input type='radio' name='strMaxLen2' value='20' onClick="return validchk();">Double Wide (20 Char Max)<br>
<input type='text' name='strText2' id='strText2' size='40' maxlength="40" onKeyUp="return validchk();">
<br>
<input type='radio' name='strMaxLen3' value='40' onClick="return validchk();">Normal Text (40 Char Max)
<input type='radio' name='strMaxLen3' value='20' onClick="return validchk();">Double Wide (20 Char Max)<br>
<input type='text' name='strText3' id='strText3' size='40' maxlength="40" onKeyUp="return validchk();">
<br>
<textarea rows="4" cols="40" name="strSample">
</textarea>
<input type="submit" name="Submit">
</form>
</body>
</html>