When you think ASP, think...
Recent Articles
All Articles
ASP.NET Articles
ASPFAQs.com
Message Board
Related Web Technologies
User Tips!
Coding Tips

Sections:
Sample Chapters
Commonly Asked Message Board Questions
JavaScript Tutorials
MSDN Communities Hub
Official Docs
Security
Stump the SQL Guru!
XML Info
Information:
Feedback
Author an Article
ASP ASP.NET ASP FAQs Message Board Feedback
Print this page.
Published: Monday, August 07, 2000

Generating Dynamic Code 39 Bar Codes on a Web Page

By Pete Draigh


More Bar Chart Articles!
To learn more about dynamically generating I25 bar charts through an ASP page, be sure to read: Dynamically Generating I25 Bar Codes!

- continued -

Hello, my name is Pete Draigh. I work for a regional auditing company and do all of our software and data-driven web development using mostly SQL Server, ASP, and a little Access. This article is about a solution I worked out to dynamically generate a bar code based on the value of a field in a database. It would be useful in a situation where users need to enter information into a system, be presented with a summary 'this-is-what-you-entered' page that they can then print and can be tracked later with the barcode. Similar to what many shipping companies such as Fedex use when you use their program to generate an airbill. I'd welcome any feedback at pdraigh@businessstrategy.com.

The problem was to translate a value such as "ABC" into a barcode. We use the Code 39 barcode for several things we do at our company. (For more information on Code 39 barcodes, take a moment to read: Code 39 Specification.) I wanted to put that barcode on a web page so that the user could print out a page containing that barcode and later, we could use that in the indexing process in our imaging system. Most users have a Code 39 font installed on their system for other purposes so I could have just changed the font face in the page, but I didn't want to rely on them having it. I wanted to generate it in the page and have that be independent of the browser/client computer, etc.

My solution was to create GIF files for each supported character in the the Code 39 set. Since we have the Code 39 font, I printed a page with each supported character encoded in that font so I had a printed sample for each character. Then I went high-tech. I used Microsoft Paint to make a text box of one character using the Code 39 Font. A little backwards engineering to see how many pixels a thick line was, thin gap, etc. and then I created a bitmap in Paint for each character. I then converted those to GIF files using Microsoft Image Composer. (There may be a more direct way, but it worked.) Finally, I tested the characters with our scanner software to make sure they were interpreted correctly. Below you can see the codes for A, B, and C and asterisk. (You can also download the complete set of barcode GIFs that I created.)

Code 39 for A
Code for A
Code 39 for B
Code for B
Code 39 for C
Code for C
Code 39 for Asterisk
Code for Asterisk

Then to represent the database value as a barcode in my ASP page, I simply loop through each character in the BarCodeText value and create an <IMG SRC="..."> tag to replace the character with the character's bar code GIF. (So if an item has the BarCodeText value "ABC", the asterisk GIF would be outputted, then the A, then the B, then the C, and finally another asterisk.) Simple, and doesn't require anything on the client machine. The code is a simple loop:

'Code 39 barcodes require an asterisk as the start and stop characters
Response.write "<IMG SRC=""asterisk.gif"" WIDTH=""30"" HEIGHT=""36"">"

For x = 1 to Len(Trim(rst("BarCodeText")))
  Response.Write "<IMG SRC=""" & mid(rst("BarCodeText"),x,1) & _
                 ".gif"" WIDTH=""30"" HEIGHT=""36"">"
Next

'Code 39 barcodes require an asterisk as the start and stop characters
Response.write "<IMG SRC=""asterisk.gif"" WIDTH=""30"" HEIGHT=""36"">"

If the value of BarCodeText in the current record in the recordset was "ABC", the HTML result of the above code would be:

<IMG SRC="asterisk.gif" WIDTH="30" HEIGHT="36">
<IMG SRC="A.gif" WIDTH="30" HEIGHT="36">
<IMG SRC="B.gif" WIDTH="30" HEIGHT="36">
<IMG SRC="C.gif" WIDTH="30" HEIGHT="36">
<IMG SRC="asterisk.gif" WIDTH="30" HEIGHT="36">

And it would result in the following images:

The printed page can now be used as part of a tracking system using barcode scanners, part of an indexing process in a document imaging system, etc.

A couple notes on barcodes: Not all barcode sets support all the characters. Code 39 is a nice, easy one. It's variable length, and supports all the capital letters, digits, asterisks, and 7 special characters. It uses a consistent scheme of 5 lines (2 thick, 3 thin) and 4 gaps (1 thick, 3 thin) for every character. Other sets support more and use different encoding schemes. Depending on the barcode you use, make sure the field validation in your database will only accept supported characters at the time of entry. Make sure you have a GIF for each character, a fall-back if the database may have unsupported characters, and you modify the IMG tags for the correct directory, filename, etc. You can also change the WIDTH and HEIGHT attributes of your IMG tag to make the barcode display larger or smaller on your page.

Also, a simple loop like this won't work if you need to use the special characters since you can't name your GIF file +.gif, for example. If you anticipate needing the special characters, you can write a function that receives the ASCII value of the character and then returns a string equal to the filename using a CASE statement. If your database field is an integer or can only contain letters or digits, a simple loop such as the sample above will work fine.

Not a real complex solution, but sometimes the simpler, the better!

Happy Programming!


Attachments:

  • Download the barcode GIFs


  • ASP.NET [1.x] [2.0] | ASPMessageboard.com | ASPFAQs.com | Advertise | Feedback | Author an Article