PDF Forms and Javascript

Acrobat: Forms and Javascript

Don’t want to write CGI? Try this: Adobe Acrobat Reader and Forms Data without Custom CGI

Part 1: Insert into a database.

This note is largely based on the demonstration of Acrobat 5.0 Forms and Javascript I gave at the April 2001 Adobe PDF Days in India and South Asia.

The example Acrobat Forms Zipped FilesPDF and JavaScripts have been zipped here.

Creating the PDF

The first step is to create the base form. Here, the simple form is created in Microsoft Word 2000. Using the PDFMaker, covert the document into a PDF.

Adding the Form Fields

Adding the form fields is a matter of using the Form tool ( i) to create four fields in the areas as indicated by the original Word areas.

Select form tool and drag out the form field filling to the area required.

You can copy and paste or ight click to copy, right click to paste to duplicate fields.

Double click on the field to edit the Field Properties. The scripts below nominate specific fields

Adding a Button

To create a button, use the same field tool as above and create it in the area required. Change the type to Button from the Type: popup menu.

In the Actions tab, select the Mouseup ‘when this happens…’ and click on the Add button. From the Type: popup, select ‘Javascript’

By clicking on the “Edit…” button you can insert the code into the Javascript section. This Javascript is executed when the ‘mouse goes up in the button’ – or in other words, when the mouse is clicked.

The Javascripts

// declare and fill local variables var lAppName = this.getField("app.name").value; var lAppAge = this.getField("app.age").value; var lAppSkills = this.getField("app.skills").value; var lAppYears = this.getField("app.years").value; // save to ODBC database on local machine. // this is named in Control Panels>Administrative Tools>Data Sources var con = ADBC.newConnection("jobs"); var statement = con.newStatement(); // var query = "INSERT INTO jobs ( name, age, skills, years) values ('" + lAppName + "','" + lAppAge + "','" + lAppSkills + "','" + lAppYears + "');"; // execute SQL statement on database statement.execute(query);

Code example 1: Simple ODBC Insertion from a PDF form.

PlanetPDF on ADBC in Adobe PDF Forms

NB: Before this script will work, there needs to be an ODBC database source on your machine mapped to a database containing the table: ‘jobs’. This table will need at least 4 columns defined: ‘name’, ‘age’, ‘skills’ and ‘years’ I use Microsoft Access as my development database. Using Control Panels>Administrative Tools>Data Sources (ODBC) control panel, I have created an ODBC connection to the jobs.mdb file (Microsoft Access). This can be any ODBC datasouce.

var lAppName = this.getField("app.name").value; var lAppAge = this.getField("app.age").value; var lAppSkills = this.getField("app.skills").value; var lAppYears = this.getField("app.years").value; var lWeb = this.getField("web").value; if (lWeb == "Yes") // we are submitting via a web server { var fieldsToSubmit = new Array("app.name","app.age","app.skills","app.years"); // change the http: URL to appropriate server name and/or address this.submitForm("http://127.0.0.1/jobs.asp#FDF",true,false,fieldsToSubmit); } else { var con = ADBC.newConnection("jobs"); var statement = con.newStatement(); var query = "INSERT INTO jobs ( name, age, skills, years) values ('" + lAppName + "','" + lAppAge + "','" + lAppSkills + "','" + lAppYears + "');"; statement.execute(query); }

Code example 2: Extending the example above, showing web submission alternative. The ASP referenced is in code example 3 below.

NB: This Javascript required the ASP in the next code example installed onto the server. The code above points to a server at “http://127.0.0.1/jobs.asp” This IP address is also known as the loopback address — its the same machine as the form is currently running on. Of course with real installations, this would point to a fully qualified domain name where the server-side script is residing. When sensitive information is involved, it is recommended to use a secure socket connection such as https://…

The Active Server Page (ASP)

<%Response.ContentType = "application/vnd.fdf"%> <% Set FdfAcx = Server.CreateObject("FdfApp.FdfApp") Set FDF = FdfAcx.FDFCreate Set FDFin = FdfAcx.FDFOpenFromBuf (Request.BinaryRead(Request.TotalBytes)) lName = FDFin.FDFGetValue("app.name") lAge=FDFin.FDFGetValue("app.age") lYears=FDFin.FDFGetValue("app.years") lSkills=FDFin.FDFGetValue("app.skills") set jobsConnection = Server.CreateObject("ADODB.Connection") jobsConnection.Mode = adModeReadWrite jobsConnection.Open "jobs" set jobsRecordSet = Server.CreateObject("ADODB.RecordSet") jobsRecordSet.LockType = 3 jobsRecordSet.Open "jobs",jobsConnection jobsRecordSet.AddNew jobsRecordSet.Fields("name") = lName jobsRecordSet.Fields("age") = lAge jobsRecordSet.Fields("years") = lYears jobsRecordSet.Fields("skills") = lSkills jobsRecordSet.Update jobsRecordSet.Close Response.BinaryWrite FDF.FDFSaveToBuf FDF.FDFClose %>

Code example 3: Active Server Page (ASP) using VBScript inserting the fields the form submits in code example 2.

NB: this code example requires an ODBC connection defined named ‘jobs’ This points to a database that contains the table ‘jobs’ with fields ‘name’, ‘age’, ‘years’, ‘skills’

Also installed is the Adobe FDFTK – Forms Data Format ToolKit. The Windows installer is available here.

For More Information

The best resouces for PDF and developer related information is PlanetPDF. More specifically, there is an Indepth Guide here. A fundamental requirement on the server-side is the Adobe FDF Toolkit

Adobe Systems’ information on the Forms feature of Acrobat is here.