Form For ActiveX Plus when using a Perl CGI Script
The sample application below was designed
to demonstrate how to use the Active X control with a Perl Script.
HTML Form Code
Shown below is the HTML source code behind the form shown above. The
HTML code below is color coded as follows: Black text is the formatting
HTML used for creating the table and separating the elements of the page
into an orderly fashion. Red text is JavaScript. The Javascript is run
on the client side to determine the Browser and Browser Version that the
visitor to the page is using. The Blue text is the most important, these
are the HTML Form elements which will be submitted to the server. All
Green text are comments to help you understand what is happening and why.
<html>
<head>
<title>ActiveX Asp Test</title>
<script language="JavaScript">
<!-- Hide from Older Browsers: if they are using
Netscape 1.0, unlikely but not impossible then JavaScript would be treated
as plain text and be printed to the screen, by enclosing the javascript
in a comment tag, this can be prevented.
function Runme(){
//function to determine Browser type and version:
If the Browser supports .png files then create .png images, otherwise
create .gif images. If their Browser does not run this script because
it is too old or javascript has been disabled, we shall set the default
value to .gif. (The Advantage of .png files is that they are much smaller
in size (in terms of bytes) which means quicker loading times and less
space used on the server.)
var bName = navigator.appName;
var bVer = parseFloat(navigator.appVersion);
document.forms['BarCodeForm'].elements['Browser'].value = bName;
document.forms['BarCodeForm'].elements['Version'].value = bVer;
}
Done Hiding -->
</script>
</head>
<body onLoad="Runme()"><!--
Here we tell the Runme code to run when the page is loaded -->
<form METHOD="POST"
NAME="BarCodeForm" action="scripts/barcode.pl">
<!-- Here we tell the Browser the name of the
form, the method of submitting the data to the server, and the name (and
location) of the script to run when the form is submitted. There are 2
methods of submitting data to the server GET and POST. When you use the
GET method the form data is appended to the URL in the query string (e.g.
http://www.taltech.com/barcode.asp?field1=value&field2=value) which
can be read by a server side script using the Request.QueryString collection.
In Contrast, the POST method does not append data to the URL, which means
that the number and size of field values are nearly unlimited, and the
Data is read by the Server script using the Request.Form collection. -->
<table border="1" width="100%" cellspacing="0"
cellpadding="0" bgcolor="EFEFE7">
<tr>
<td width="45%" height="359">
<table border="0" width="100%" bgcolor="EFEFE7">
<tr>
<td width="50%" align="right" bgcolor="EFEFE7"><small>Bar
code
message:</small></td>
<td width="50%" bgcolor="EFEFE7"> <!--
This is the text to be converted to a barcode -->
<input type="text" value="12345678901"
size="12" name="txtMessage" tabindex="1">
<input type="hidden" name="Imagetype"><!--
Here we set the default value of the Image type -->
</td>
</tr>
<tr>
<td width="50%" align="right"><small>Comment:</small></td>
<td width="50%">
<input type="text" size="12"
name="txtComment" tabindex="2">
</td>
</tr>
<tr>
<td width="50%" align="right" bgcolor="EFEFE7"><small>Comment
Alignment:</small></td>
<td width="50%" bgcolor="EFEFE7">
<select size="1" name="commentalignment"
tabindex="3">
<option selected value="0"> Left Align </option>
<option value="1"> Center Align </option>
<option value="2"> Right Align </option>
</select>
</td>
</tr>
<tr>
<td width="50%" align="right"><small>Bar
Height (mils):</small></td>
<td width="50%">
<input type="text" value="1000"
size="12" name="barheight" tabindex="4">
</td>
</tr>
<tr>
<td width="50%" align="right" bgcolor="EFEFE7"><small>Narrow
Bar Width (mils):</small></td>
<td width="50%" bgcolor="EFEFE7">
<input type="text" value="13"
size="12" name="narrowbarwidth" tabindex="5">
</td>
</tr>
<tr>
<td width="50%" align="right"><small>Bar
Code Symbology:</small></td><!--
Choose the type of barcode to create -->
<td width="50%">
<select size="1" name="symbology"
tabindex="6">
<option selected value="0"> Code 39 </option>
<option value="1"> Full ASCII 39 </option>
<option value="2"> Code 39 HIBC </option>
<option value="3"> Codabar </option>
<option value="4"> Code 93 </option>
<option value="5"> Code 128 </option>
<option value="6"> UCC/EAN 128 </option>
<option value="7"> Interleaved 2 of 5 </option>
<option value="8"> PostNET </option>
<option value="9"> UPC - A </option>
<option value="10"> UPC - E </option>
<option value="11"> EAN - 8 </option>
<option value="12"> EAN - 13 </option>
<option value="13"> Bookland </option>
<option value="14"> MSI/Plessey </option>
<option value="15"> PDF417 </option>
<option value="16"> Aztec Code </option>
<option value="17"> Data Matrix </option>
<option value="18"> MaxiCode </option>
</select>
</td>
</tr>
<tr>
<td width="50%" align="right" bgcolor="EFEFE7"><small>Rotation:</small></td>
<td width="50%" bgcolor="EFEFE7">
<select size="1" name="rotation"
tabindex="7">
<option selected value="0"> 0 degrees </option>
<option value="1"> 90 degrees </option>
<option value="2"> 180 degrees </option>
<option value="3"> 270 degrees </option>
</select>
</td>
</tr>
<tr>
<td width="50%" align="right"><small>Foreground
Color:</small></td>
<td width="50%">
<select size="1" name="forecolor"
tabindex="8">
<option selected value="0"> Black </option>
<option value="255"> Red </option>
<option value="65280"> Green </option>
<option value="16711680"> Blue </option>
</select>
</td>
</tr>
<tr>
<td width="50%" align="right" bgcolor="EFEFE7"><small>Background
Color:</small></td>
<td width="50%" bgcolor="EFEFE7">
<select size="1" name="backcolor"
tabindex="9">
<option selected value="16777215"> White </option>
<option value="255"> Red </option>
<option value="65280"> Green </option>
<option value="16711680"> Blue </option>
</select>
</td>
</tr>
<tr>
<td width="50%" align="right" valign="top">
<div align="left">
<input type="checkbox" value="ON"
CHECKED name="quietzones" tabindex="10">
<small>Include Quiet Zones</small></div>
</td>
<td width="50%" valign="top">
<input type="checkbox" value="ON"
name="bearerbars" tabindex="11">
<small>Include Bearer Bars</small></td>
</tr>
</table>
</td>
<td width="55%" height="359">
<table border="0" width="100%" height="100%">
<tr bgcolor="EFEFE7">
<td>
<div align="center">
<center>
<p>
</center>
</div>
<div align="center">
<center>
<p>
<input type="hidden" name="Browser">
<br>
<input type="hidden" name="scrHeight">
<input type="hidden" name="scrWidth">
<input type="hidden" name="Version">
<input type="submit" name="Submit" value="Submit"
tabindex="12">
<p> </p>
</center>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table> </form></body></html>
Discussion
Our form gives the visitor the opportunity to change only the most common
properties of the TAL Bar Code ActiveX control.
Related Links
Introduction to Active Server Pages
Using The TAL Bar Code ActiveX Plus with PERL
CGI Scripts
|
