Form Building

This page contains form building considerations, best practices and tips to help you become an expert in digitizing your form(s)!

STEP 1: Form Building

Please visit our Glossary for an explanation of terms you are not familiar with.
Before you start
Ask yourself the following questions. Does your current form design and layout...
  • Already work well?
  • Fit the form filler workflow?
  • Capture the right information?
  • Fit best practices or standards‎?
Hick's Law
The more choices someone has, the longer it takes them to make a decision.
Try to balance...
  • Showing the fullness of the form (the entirety of the work)
  • Improving usability
  • Minimizing confusion and clutter
  • Capturing all relevant details
Consider the following while planning the digitization of your form(s)...

 

It is important to have clinical knowledge of the terms and acronyms used in a form. This helps with sequence, structure and wording of the questions.


If the form builder has no clinical background, consult a clinician about form content and workflow.
For example, should symptoms/conditions be offered as a list of check boxes? (select as many as apply)


OR should they be radio buttons? (select one)

 

As part of the form analysis, consider all the forms which will be digitized for your organization.

Look out for groups of fields that exist on multiple forms. These can be built into re-usable blocks which, in turn, can be dropped into any form.

A modular approach makes the work of form building more efficient. It also helps maintain consistency and standardization.

 

Include

  • Items that the end user must fill in
  • Supporting information and reference material using
    • expandable sections
    • contextual tooltips
    • descriptions
    • links
Why use links?
If the referenced content changes, the form does not need to be rebuilt.

Do not include

  • Routing and administrative items which can be managed in the background, without user input.
  • Items to be filled in by the form recipient. By the time they receive the form, it cannot be further modified.

 

Radio buttons vs. check boxes

A radio button is a common web form component and prompts the end user to choose just one of the options provided.

Use a radio button for 'select one' and check boxes for 'select all that apply'.

Drop downs

Drop Downs are very efficient to build but do have some draw backs. They are not always the best replacement for a group of related check boxes. In fact, a group of check boxes are often best to allow users to see all the options at a glance. 

Since drop downs don't exist on a paper form, it is best to introduce them with care. They hide the 'entirety of the form' which can be problematic. Keep in mind that many users will be transitioning from a paper form.

Individual check boxes

Each selection is offered as a Boolean (True/False) choice. 

Using individual check boxes may introduce unnecessary overhead for the form builder. Instead of one question with a list of responses, they must build a check box for each response and then group them. 

Sometimes, individual check boxes are needed for technical or layout reasons. See the Hands on tab for more on using individual checkboxes.

Select Boxes

Select Boxes, also known as a multiple-selection list box, is a group of check boxes which answer a single question.
The default behaviour for this component is "select all that apply".

Validation can be added to control the number of items that must be checked (e.g. at least three, no more than two).

 
 
One of the strengths of an electronic form over a paper form is that there is more control over what the form filler can enter. This is is known as validation.

Validation should be considered early in the planning process. Some examples are:

  • Setting a field as required. The form cannot be submitted until the field is filled.
  • Constraining results, such as setting a range for a medication dosage.
  • Preventing "nonsense" data, such as not allowing future dates for events that cannot have happened yet.

a 

The form-building tool offers a wide range of components to build forms. eForms supports a subset of components which meet the industry standard data format, FHIR. Using the supported components helps to ensure effective, accurate, standards-based data transfer.

The table below lists the components that are currently supported by eForms. Note the following status definitions:

  • Future: This component will be supported in future but this work has not been fully prioritized/scheduled.
  • Alternative: There are other ways to accomplish the functionality offered by this component.

screen shot: Basic Components

Advanced Components

screen shot: Advanced Components
Layout Components
screen shot: :Layout Components
Data Components
screen shot: Data Components
Premium Components
screen shot: Premium Components

 

The eForms Solution offers a PDF output in addition to a data output for completed forms upon submission. When digitizing your form(s) it's important to keep your PDF layout in mind. Review the PDF output of eForms page for more information.

 
Best practices

The eForms team manages a Best Practices Committee which has representation from Doctors of BC and other Health Authority leadership. Surveys are sent to participating clinicians for their feedback on best practices. Findings are discussed at regularly scheduled meetings - and decisions are published here.

Required

 

Gather the requirements for your form; such as:

  • optimal user workflow
  • what fields should auto-populate
  • clinical and administrative needs
Consult other best practices guide for building forms, such as the DTO Form Guidelines and Best Practices.

Consider on which platforms (laptop, tablet, mobile) your form will be most used on.


Reach out to DoBC/DTO to setup physician engagement sessions for clinical feedback.

 
When creating a form, use the standard patient and provider panels (if that information is required)

Use the minimum values for the patient and/or provider panel if those pieces of information are used on the form building build
Patient and provider panel fields can be extrapolated upon as needed

 

If your form is expected to collect clinical information, include a free text field at the end of the form.


This is the digital equivalent of 'writing in the margins' - which clinicians use to pass on critical information that is not collected elsewhere in the form.

This is used to capture any information deemed necessary by the form filler - and not otherwise captured by the form.

 
  • Maintain clear positive statements
  • Do not pre-check checkboxes
  • If using radio buttons, assume no default answer‎

 

Form Introduction Headers

  • Should have logo(s)
  • May have instructions/introductions
  • Must have disclaimer
  • They must appear in the following order:
  1. Logos
  2. Introductions/Instructions
  3. Disclaimer

 

Expect column order to be read down first, then right, like a newspaper.


  • Expected eye movement for form users is to read down columns first (starting at the top left), and then move to the next column in a rightwards direction

 

Best practices to follow when using tooltips


A Tooltip should be:
  • kept between 20-40 words (approximately 1-2 sentences) in length
  • clearly worded with direct instructions
  • associated with the field it is providing details on

 

Best practices when using descriptions

Descriptions should be:

  • associated with either the field or segment they are providing details on
  • clearly worded and concise
  • only as long as needed to relay the information to the form filler

Recommended

 
  • Keep the required fields (*) limited to only the fields which are absolutely required.

 
  • Must have logos
  • May have instructions/introductions
  • Must have disclaimer
  • They must appear in the following order: 
    1. Logos 
    2. Introductions/Instructions 
    3. Disclaimer


Patient and Provider panels must be standardized across all eForms and must not be mended to appear similar to an eForm's paper counterpart.


  • Patient and Provider panels must appear in vertical columns beside each other
  • Patient and Provider panels must always adhere to the minimum required fields, as follows:
Panel
 Required Fields

Patient

  •  PHN
  • Last Name
  •  First Name
  • DOB
  •  Gender

Provider

  •  First Name
  • Last Name
  • MSP ID
  • Phone Number
  • Extension

 


 
 

Use Tooltip if

  • only a small number of users require extra information to successfully complete a field
Use Description if
  • many users require extra information
  • the information is critical to the completion of the form field
Use either if
  • a moderate number of users require extra information

 

‎Can tooltips and descriptions be used together? If if so when?


Use both a tooltip and description if you need to provide both additional information to all users, and tips or further help to a small subset of form fillers; e.g., in a situation where there is both critical information and extra information, the critical information can be placed in the description, with a reference to the tooltip for additional information.

 

 
Avoid excessive use of tooltips and descriptions on forms to mimimize clutter.

Consider linking to an external resource or changing the structure of the form to better facilitate user understanding.
 

 

Keep error messages short and concise.


Prioritize having a short, concise error message which directs the user to how to resolve the triggering issue, or containing appropriate error messages to communicate to support for their timely resolution of the issue.

 

 

Break up long forms into multiple form tabs/pages


  • To keep form length under control, make use of multiple tabs/pages to break up information
  • Ensure appropriate error messaging to lead users to missed information on previous tabs
 

 

If building a multipage form, it is better to design switchable tabs over a breadcrumb pathway.


A breadcrumb is the wizard style layout design used in a multipage form. It is best to use switchable tabs over breadcrumb for tidiness of design.
 

 

When there are few options, use radio buttons; when there are many options, use dropdowns.


  • 'Few' options: 4 or less
  • 'Many' options: 7 or more
  • For 5-6 options, consider the context and apply the best choice for that specific control
  • Prioritise the fewest number of clicks 

 

A long list: 10 or more values

Short list: 10 or fewer values


Long Lists

  • Order alphabetically, descending 
  • Place any 'other' options at the bottom of the list
Short Lists

  • Order the items by how frequently they are selected (e.g., 3 items or less); 

  • Also consider placing the most used items at the top, then ordering the remainder alphabetically
  • Place any 'other' options at the bottom of the list
 

 
When fields would be irrelevant or unnecessary to the workflow currently being followed by the form filler, use conditional logic to hide those fields
e.g., if the form is used for multiple purposes, but only ever one purpose at a time

Ensure that for all user experience paths through your form, the user flow remains clear to the form filler.


 

When using hidden fields with conditional logic, consider the expected duration your form will take to complete, and if the number of hidden fields you are using will obfuscate this time to the form filler; avoid misleading the form filler on duration to complete the form by hiding too many fields

 

Group similar information or questions together; such as reason for referral, additional patient information, clinical details.

 

When creating a form with columns try to limit the columns used to two, and consider using only a single column. Additional columns can be difficult to use on mobile or tablet screens. 

 

 
When designing a form, allow for white space to prevent clutter and permit mobile users space to use finger gesture commands. 

 

If Opt-Out questions are to be used, use a radio button which defaults to no answer. 

Where there is a significant improvement to patient health, permit soft paternalism in questions; radio button binary (default, ‘null’) 

 

  • Include a time estimation to complete, either a single value or a high/low range.

  • To acquire this time, perform user testing and record the time to complete

  • Update this value as your dataset expands

 
Include a single, optional, free text area for users to provide any/all feedback to the form owner: request contact information from feedback provider.
 


 
Where to include additional clinical information, and why
Placement of Additional Clinical Information field will come at the end of the form; this is used to capture any information deemed necessary by the form filler not otherwise captured by the form

 

Avoid overusing tooltips and descriptions to prevent clutter


Recommended:
Avoid excessive use of tooltips and descriptions on forms to avoid clutter; consider linking to an external resource or changing the structure of the form to better facilitate user understanding












Hands on

Accessing the builder

 
The eForms Solution team maintains a number of builder environments (also known as Tenants). Each form owner team has access to a builder environment.

One of the mandates of the eForms Solution is to establish and maintain technical form standards for the province. To promote this effort, each builder environment includes some standardized features. For example, there are blocks of fields for Patient and Provider. These are pre-configured for use with other applications and EMRs.

Each form owner (form building team) must have an initial administrator. That person can then can grant access to other form builders. 

Health Authority builders have a shared form building environment. This should be treated much like a shared network drive or folder. Please do not touch other team's Forms or Resources without permission. 

 

The initial administrator should change their password the first time they log on to the builder.


The instructions below can be used to change the password for any user.
  1. Go to: https://apps.form.io/phsa/#/auth
    Enter the Tenant name, your email address and the password eForms assigned to you.
    screen shot: how to change password step 1
  2. Click Resources on the left hand side
    screen shot: how to change password step 2
  3. Search for the Admin Resource
    screen shot: how to change password step 3
  4. Once it is located, click the View Data button on the right hand side
    screen shot: how to change password step 4
  5. In the View Data Tab, locate the ID for which you need to change the password
  6. Click the Edit button on the right hand side
    screen shot: how to change password step 5-6
  7. In the Edit Admin Submission screen, enter a new password in the Password field
    screen shot: how to change password step 7
  8. Click Submit
  9. The password is now changed 

 
  1. Log into your environment
    screen shot: how to add a user step 1
  2. Click Resources on the left
    screen shot: how to add a user step 2
  3. Search for the Admin Resource
    screen shot: how to add a user step 3
  4. Once it is located, click the Enter Data button on the right hand side
    screen shot: how to add a user step 4
  5. Enter the new builder's email and a password of your choosing
    screen shot: how to add a user step 5
  6. Click Submit
  7. To confirm that your submission was successful, repeat steps 2 and 3 to get to the list of users in the environment. Find the user you just added in that list.
    screen shot: how to add a user step 7
  8. The builder is now able to logon onto the form building environment user the email and password you defined in step 5.
 

 

Resources

Resources are customizable, modular, groups of fields which can be dropped "as is" into forms repeatedly.
Note:
When a Resource is dropped into a form, it is a snapshot of the Resource at that time. If the Resource is later updated, the forms containing that Resource are NOT automatically updated. 

Default Resources offered by eForms

Clinical 

Clinical Resources are pre-configured with HL7 FHIR tags to enable the creation of a conformant FHIR bundle. Some functionality - such as pre-population - relies on this configuration. The eForms team encourages the use of the Clinical Resources in forms. See list below:
  • Patient
  • Provider
  • Address

Learn 

Learn Resources were created by the eForms team to support builders. They are examples - intended to demonstrate and/or explain how to set up advanced features. These Resources allow the builder to see “under the hood” so that they can replicate the setup. 
To help keep them separate from other Resources, they are prefixed with zz_Learn. This puts them at the end of the list when sorted alphabetically. 
As new Learn Resources are built by the eForms team, they are distributed to each environment. 
See also "The Learn Resources" list below.

System 

System Resources are only used to set up users. They are pre-configured with permission levels. See also "How to add a user", above.

Use the System Resources only as instructed. Do not drop them into forms. 
See list below:
  • User
  • Admin
  • Form Creator
  • From Consumer
  • Tenant
 

Building forms

 Required

 

Text Fields for dates

When a time stamp is not required, use the Text Component. It can be configured to display as a calendar. The form filler can click on the date rather than typing into the field.


The reason for NOT using the Date/Time Component is that it is hard-coded to submit a time stamp along with the date. Even if it is configured without time, it sends a time stamp.

eForms also advises against using the Day Component because it cannot be made FHIR conformant.

Default Setup

  1.  Add a text field to your form.
  2. In the Display tab, under Widget, click the drop down to change the widget type to Calendar Picker.The Calendar Widget Settings should now be available in the window below.

  3.  Change the enableTime setting from true to false:
    "enableTime": false,
  4. Delete the time formatting from format and date format  so that they look like this:
    "yyyy-MM-dd",

    The screen shot above shows the correct settings.

Customization

Constraints

  • To prevent past dates from being entered, add the following to minDate:
    "minDate": "moment()"
  • To prevent future dates from being entered, add the following to maxDate:
  • "maxDate": "moment()"
  • To set the Default Date to Today
    1.   Click the Data Tab
    2. Scroll down and expand Custom Default Value 
    3. In the JavaScript window enter the following:
      value = moment();

Calculations

Calculations can be performed on dates using the Widget Settings and/or Data Tab -> Calculated values. This requires advanced understanding of JavaScript or JSON logic and is out of the scope of this article.


See also the Learn Resource: Time Constraints in Text Field.

 

Patient and Provider Panels (Resources)

eForms has pre-configured panels for:

  • Patient
  • Provider
  • Address (used within both patient and provider)

These panels must be used for the form to pull data correctly from EMPI and PLR. This data will pre-populate the relevant fields to make filling in the form much quicker and more accurate.

 

They are available as Resources, a feature of the form builder. Resources are modules which can be standardized and then dropped into forms repeatedly.


See also the Best Practices section on this topic.

 

Open link in new tab

Internet links must be set to open in a separate tab. If not, the eForms launcher will display an error and the form filler could lose data.

For instructions, see the Learn Resource: Open Internet Link in New Tab

 

Enable the Submit Button

The default setting for the Submit button is "Disable on form invalid". This means that the Submit button will appear greyed out and not clickable until all required fields are filled in. This setting is not ideal because form fillers often think something is wrong with the form.

eForms requires that this setting be unchecked. When set up properly, the Submit button is dark blue and reacts when clicked - even if some required fields are not yet filled out.

Validation and Submission

The Submit button for any form is "aware" of all the validation in the form. Recall, one of the strengths of electronic forms is that the form cannot be submitted until all fields are filled in correctly.


Clicking the Submit button triggers a validation check. If there are invalid fields (e.g. required), a red validation error is displayed at the top of the screen. This red text is clickable, and it links to the place on the form that has not passed validation.

 


The form can be set to trigger validation before or after it submission. The out of the box setting is for the button to be greyed out (light blue) UNTIL the form passes the validation check. As mentioned at the outset, this is not user friendly.


How to set up the Submit button properly

Any/all Submit buttons must be changed from this default setting. The Submit button should display as a dark blue and be clickable from the moment the form is opened, regardless of whether the form is filled in or not. This facilitates testing and helps minimize confusion for form fillers.


To change this setting:

1.       Go to the configuration gear for the Submit button:

2.       In the Display tab, find the Disable on Form Invalid setting towards the bottom of the screen.

If left checked, the Submit button will be greyed out/light blue.

3.       Uncheck this setting

The Submit button should be a dark blue.

 

Limit the file size for upload

The file upload component in the builder defaults to 1 GB. This setting must be reduced from it's default.

eForms has set a file size limit of 30 MB per submission. If a user attaches a file or files with a total size exceeding 30 MB, they will not be able to submit the form until the attachment(s) size is reduced.


See the Learn Resource:  Attach Multiple Files. It includes directions for the file size setting.

https://ewiauthor.phsa.ca/health-professionals-site/PublishingImages/health-professionals/clinical-resources/eForms/good-idea-cropped.jpg Recommended


Using JSON for long drop down lists
Drop down lists are handled with the Select component.

For short lists, it's easiest to enter the selections directly in the Data Tab of the Select Component.

For long lists, it is usually better to use JSON. 

The JSON can be:
• Pasted directly into the Data tab (Raw JSON)
• Stored as a .JSON file on a server. The Select component is then pointed to this file

Note:
The JSON method is suited to any list of value pairs that is already prepared in an external data source, such as an Excel file. It is easier to update and sort the external data, rather than do this in the builder.


How to use JSON for drop down lists

Prepare the Data File‎

  1. Prepare the list in spreadsheet software such as Microsoft MS Excel ®
  2. Make only two columns with the following headings
    • label
    • value
  3. Save the file as a CSV
  4. Convert the CSV file to a JSON file
    This can be done easily with a free online converter - assuming the data in the list is not sensitive - such as:
    https://www.freeformatter.com/csv-to-json-converter.html
  5. Once the JSON file is prepared, save it with a meaningful name - such as: indications.json

    Method 1:  RAW JSON

    ‎

    1.  In the form builder -> Data tab -> Data Source Type:
      Select Raw JSON
    2. In the Data Source Raw JSON area, copy and paste the text from the saved JSON file
    3. Enter the word "value" (no quotes) in the Value Property field

    Method 2:  URL

    You must consult the eForms team before using the URL method.
    There are additional technical requirements such as opening firewalls.

    ‎

    1. In the form builder -> Data tab -> Data Source Type:
      Select URL
    2. In the Data Source URL, enter the URL where the JSON will be published and stored
    3. Enter the word "value" (no quotes) in the Value Property field

     

     Individual Check boxes

    Groups of check boxes can be handled with the Select Boxes component. However, there are situations when it is better to use individual Checkbox components.

    It is also possible to "convert" individual Checkboxes to Radio Buttons - and configure a group of radio buttons to toggle (so that only one of the group can be selected).


    Individual Checkboxes must be used for the following:

    • To add conditional fields in the middle of a list of check boxes
    • When each data item has a specific
      • property (e.g. tag)
      • visual indicator (e.g. tooltip)

    For instructions on setting up check box as radio see the Learn Resource: Check box as Radio

     

    Constrain file types for upload

    You may only want to receive files of certain type - such as PDFs. 

    You can limit the file types allowed by speficying the extension.

    See the Learn Resource: Specify file type for upload

     

    Build with Wizards

    Wizards are a useful way to guide users through filling in a form. They are well suited to longer forms - but can help keep even a small form look less cluttered and flow smoothly or fit a specific workflow.


    How to build with Wizards 

    1. Start creating a new form
    2. From the Display as drop down, select Wizard

    3. Build the first page of your Wizard as you would any other form

    4. When you are ready to build the next Wizard page click the  +PAGE  button
    5. Be sure to save the form in Display as Wizard mode so that it will open as Wizard when it is rendered.

    Changing the order of wizard pages

    1. To move Wizard pages around, change back to Display as Form. Once you are in Display as Form mode, each Wizard page appears as a Panel. 
    2. Move the entire Panel to a different position to re-order the Wizard pages. Be careful not to drop it into another panel.
    3. Switch back to Display as Wizard to see your re-arranged pages.

    Warning


    The Submit button may be removed when you toggle back and forth between the two display modes. As per the vendor, this is expected behaviour. If it has been removed, it is very simple to re-add by dragging and dropping a new Submit button onto the form.


    See also the section on multi-page forms under Best Practices.

     

    Show and Hide

    One of the most useful features of eForms is the ability to show or hide components conditionally.


    For a quick video describing a simple show/hide conditional, see:

    Simple Conditional Video



     Tips/methodology


     Save Frequently

    The form builder does not have an automatic save or undo feature. It is best to save frequently. Also, it's best to log out of the builder and close/re-open your browser from time to time. Don't leave the form open in edit mode for hours at at time. ‎

     
     Align Labels with Property Names

    When a field is first created, the field Label is automatically copied to the field Property Name. Spaces are removed and the result is in camelCase.


    Pay attention to this as you build. It can lead to very long field names which can make testing and troubleshooting more difficult.

    • Change the Property Name as needed. 
    • Consider using a naming convention for Fields and Properties, particularly if you have a lot of fields with similar and/or long names.
    • Do not use underscores.
      Unexpected results have been reported when underscores are used in Property Names.
    Example

    For the question: When is the last time the patient had surgery?


    Default Naming

    Label
    		Property Name
    When is the last time the patient had surgery?
    		 whenIsTheLastTimeThePatientHadSurgery

    Re-named (Better)
    Label
    		Property Name
    When is the last time the patient had surgery?
    		 patientLastSurgery


    This default naming behaviour is important to keep in mind when copying fields. The Property Name is incremented when a component is copied. Take a moment to align the Label with the Property Name after the item is copied.


    For more on this topic, see the section below: Copy parts of the form.

     
     Copy parts of the form

    You will work more efficiently if you copy parts of a form as you build, rather than create everything from scratch. Any component can be copied, including layout components which contain other components. 


    About Copying Form Parts 

    Each form component has a copy/paste icon in the top right.

    Be very careful as you click this area because it is easy to miss and accidentally click the red X - which deletes the component.

    Since there is no immediate Undo feature in the form builder, you may lose some work.


    How to copy and paste

    In the component you wish to copy, click the copy icon


    In the same component – or from another component on the form – click the paste icon.


    The component you copied is pasted just below the one you used for pasting.


    Tips

    • Components can be copied from one form to another. Once the component is copied, navigate to the other form and paste into it (and save!)
    • If you accidentally delete an important component, you may wish to close the form without saving. Then, when it is re-opened, it will be the last-saved version. With this in mind, it is a good idea to save frequently.
    • If you re-use groups of components frequently, consider building them into Resources. Resources may be more convenient since they are available from any form under the Existing Resource Fields menu.
    • When a component is copied, its API Property name is automatically incremented. This is important if the API property has special configuration. For example, some receiving systems may expect specific property names. Also, some advanced conditional logic uses the both API Property name and value.

    Regardless of how you copy a component, pay attention to the property names. Automatic incrementation can be somewhat unpredictable. Also, the form may not save as expected if a property name is repeated.

    See also the section above on aligning labels and property names.

     
     Keep UI and UX in  mind

    UI: User Interface is the look and feel of the form.


    UX: User Experience is the performance and functionality of the form.


    You don't have to be an expert on these to keep them in mind throughout the form build.

    Although some aspects of the UX are beyond the control of the form builder, you can make decisions which help - or hinder. 

    Review the form frequently to ensure it has not strayed from its intended workflow. For example, sometimes fields can be arranged, grouped, hidden/shown to suit the workflow better.

    The goal of the form builder should also be to make the form attractive and intuitive to work with. A well designed, attractive UI will grab attention and increase adoption.‎

     
     Use hidden helper fields

    For some more complex calculations and logic, you can use helper fields, then hide them.

    Be sure to configure the field to show the value when hidden - or the logic/calculation may not work.
    In the Data tab for the hidden field, uncheck Clear Value when Hidden.

    Example: Count Select Box Responses

    The Learn Resources

     

    List of Learn Resources


    Question or Issue
    		Relevant Learn Resource
    Can I add a link into a tooltip?
    		Add a link to a Tooltip
    If anything is selected in this drop down, I want another field to show.Any value in drop down triggers condition
    If anything is selected in this drop down, I want another field to show.
    		Any value in drop down triggers Show/Hide (simple)
    I don't want to use Check Box as Radio to arrange conditional fields with Select Boxes or Radio Buttons
    		Arranging conditionals with Select Boxes
    How do I make sure that at least one checkbox is selected?
    		At least one checkbox required
    Can I attach more than one file at at time?Attach multiple files at once
    Can I add up values in a table on the front end so that the end user can see the totals in real time?Calculate Data Grid Values-Advanced
    How can I count the rows of a table?Calculate Data Grid Values-Simple
    How can I add custom properties (e.g. tags) to each selection in a list and have them behave like a radio button?Check Box As Radio
    This field should only show it a certain date is entered in another field.Conditional based on date in another field
    This field should only show if the patient was born between 1970 and 1980.Conditional based on date range (absolute)
    This field should only show if the symptoms started more than two weeks ago.Conditional based on today's date
    Can I have a different Prefix or Suffix depending on what is selected in another field on the form?Conditional Prefix/Suffix
    Can I make a different Tooltip based on certain conditions, such as a value in another field?Conditional Tooltip
    Can the validation for a field be changed depending on other values entered in the form?Conditional Validation
    When I set up a conditional field within a data grid, it doesn't work as I add rows.Conditional within Data Grid
    I need this field to be hidden if another field is populated (not blank).
    		Conditionally hide if other field not blank
    I have a long list in a drop down and it takes a long time to display the list. I only want X number of items to display.Configure the Number of Search Results in a Select Component
    When a certain number of responses are filled in, I want another component to show.Count of Responses Triggers Conditional
    I need to know how many entries were made on this form. I don't need to calculate anything.Count Rows Data Grid
    I need to know how many check boxes were selected.Count Select Box Responses
    Why is the submit button greyed out?Enable the Submit Button
    The selection in this drop down is cut off - each selection text is quite long/wide. How do I make sure it is visible even if the component stays relatively narrow?
    Make wide drop down selection visible

    Both things have to happen for this field to show.Multiple triggers for one action (JavaScript AND)
    One or more of these things have to happen for this field to show.Multiple triggers for one action (JavaScript OR)
    When the numbers in these fields add up to a certain amount, I want another field to show/hide.Numeric Conditions
    * Mandatory requirement by eForms. If a link is placed on an eForm, it must be set to open in a separate tab.
    		Open Internet Link in New Tab
    I want a field to have a default value - but it depends on what is selected in another field. In fact, I want more than one possible default value depending on what is selected in the other field.Radio Buttons Trigger Different Default Values in a Second Field
    Can I have one control that flips a group of questions to the same response?Respond to all
    I want to select everything above a selection to be selected automatically
    		Select option and all above it
    I only want the form filler to upload Word and PDF documents - no spreadsheets! Can I limit the types of files they can upload?
    		Specify file types for upload
    The form filler should be able to copy/paste a phone number from a list but I want to strip all the formatting and constrain the length of the number.
    		Strip Non-Numeric Characters
    How can I enter superscript and subscript in a label?Superscript and Subscript
    I have a survey and I'd like to assign a value to each response. How do I tally up the values to create an overall score?Survey Scoring
    How do I put symbols like greater than or less than in my form? What's the best way?Symbols and Special Characters
    How do I default the date to today? How do I prevent the form filler from entering future dates? How do I prevent the form filler from entering past dates?
    		Time Constraints in Text Field
    I have a long list of values in a spreadsheet or CSV. Is there an easy way to get these into a drop down so I don't have to manually type them all in?Use RAW JSON for drop down list values
    I need a value to show up in this field if there are specific values in more than one other fieldValues in two fields trigger value in another




     

    eForms would prefer that you do not drag and drop the Learn Resources into your forms. 

    Rather, "study" them, then build what you need from scratch.

    There are risks with copying blocks of code into your form. Field names can increment and break logic. The titles and api field names of the learn components are generic or random - and will be misleading if not changed.

    If you feel you have to copy from the master, do not drag and drop the tab component which has an icon like three building blocks. Rather, drag and drop the panel.


    Troubleshooting

     
    For longer pages, it can be difficult to move a component from one end of the form to another, or drop a Resource into the right spot. Sometimes, the position you want to drop the component or Resource is out of view.

    Click and hold the component (or Resource) you wish to move. In the case of Resources, be sure your "loaded" cursor is placed over the editing pane on the right.  

    With the item still selected and your mouse button still down, use the Page Up or Page Down arrows on your keyboard to navigate to the right position on the page. Release the mouse button/drop the component in the right spot.

     
    This happens - by design - when the same Resource or copied component is repeatedly copied into the same form.

    When a field with the same field name (API Tab -> Property Name) is copied, the property name is incremented. 

    For example, if the field named "blue", is copied, it becomes "blue1". The field labels can be the same - but the form builder ensures that there are no duplicate field property names in a form. It will continue to increment the property name as more copies of the same field are added.

    It is a good idea to keep an eye on the field property names. Short but meaningful names make it easier to troubleshoot data problems, if they occur.

    eForms recommends using a naming convention for field names which may look similar or be used on many forms. 

     
    1. Not all form builders can create and modify Resources. The specific user may not be set up as an Administrator.
    2. Any form builder can view and use Existing Resources - but they have to be in form editing mode.
    The list of Existing Resources should show up on the left hand pane, below the rest of the component groups (Basic, Advanced etc.)

     

    The Submit button may appear to be greyed out (light blue) because it is set to "Disable on form invalid" by default.
    To correct this, uncheck this setting in the Submit button. This will make the button responsive, and not greyed out (dark blue).

    For instructions, see the document: Setting up the Submit Button

     

    The selection label/text seems to be cut off and there's an ellipsis in it's place.

    This typically happens if:

    • the drop down choices are long, almost the length of a sentence, and
    • the Select component has been placed in a column or data grid which force it to be narrower

    To make sure it is visible, change the Widget type to: HTML5

    See the Learn Resource:  Make wide drop down selection visible

    Tab Heading