No Coding Experience Required: Capture the Time of Day Using Laserfiche Forms
Automation from the point of capture is a persuasive value proposition for people seeking to improve enterprise-wide processes. Beginning a document’s life cycle with Laserfiche Forms allows organizations to expedite business processes, ensure information accuracy and take control of the information being collected from users. For instance, HR departments often use electronic forms to gather legally required employee information in a timely, efficient manner. Here is a useful example of how to add a Time of Day field to forms. Laserfiche Forms has a simple drag-and-drop interface that allows users to add many different field types to forms and collect the information that drives business processes.
- Does the form submitter need to enter his or her name? A Single Line field would work just fine!
- What about an address? Use the Address field!
What if the user needs to capture a time? This is a field that does not come out of the box with Laserfiche Forms, but it can still be useful for travel requests or processes involving appointment scheduling. What options does the user have? One reason Laserfiche Forms has a wide range of possible uses is because it contains a section that allows form customization with CSS and JavaScript. For those who do not have coding experience, there is no need to worry! This article introduces a new way for any user to look like a programming expert. Here is an example of what a form looks like before and after CSS customization.
Laserfiche Forms keeps track of all the fields in a particular form by individually numbering them. These field selectors are labeled in the CSS and JavaScript sections of the Forms Designer.
- Notice that the first field added to the form is labeled q1, the next will be labeled q2 and so on.
- This example shows the top 4 fields in the form, which is why they are labeled 1, 2, 3 and 4.
When the user modifies fields that are halfway down a large form, the numbers will look something like this from the CSS and JavaScript page: This example shows one date field followed by three dropdown fields, which is the optimal format for capturing time with Laserfiche Forms. Below is the CSS code used to modify form fields. Notice that the script includes the field selectors used in the image above (q1, q2, etc.).
#q1, #q2, #q3, #q4 {display: inline-block;}
#q1 {width: 40%;}
#q2 {width: 10%;}
#q3 {width: 10%;}
#q4 {width: 10%;}
#q2 .cf-small {width: 50px;}
#q3 .cf-small {width: 50px;}
#q4 .cf-small {width: 50px;}
To modify this code in a form, follow these steps:
- Match the field selectors to the field selectors in your form.
- Replace the values in the script with the numbers you found.
There are many interesting ways to modify the fields in a form, including:
- Adding fields and displaying the sum in another field.
- Finding the day of the week selected from a date field.
- Creating a form that allows searches in Laserfiche WebLink.
Get the complete guide to Laserfiche Forms and see how electronic forms have helped organizations get rid of paper and inefficiency.
