Employee Information Form
An Employee Information Form is a document that collects personal and professional details about each employee during the onboarding process. The form is usually titled with an employee's name and consists of several sections, such as contact information, work details, emergency contact, education and employment history, and other relevant information. The purpose of the form is to create a comprehensive employee profile and store important information for HR and payroll purposes.
This demo shows how to create an all-in-one Employee Information Form that allows you to add new employees on the fly. Enter an employee name and click Edit Details to open a detail form where you can fill out employee details. On the last page, you can view a summary table of all employees.
Create an Employee Information Form
To create an Employee Information Form, use a Dynamic Matrix question. It displays data in a tabular form and allows users to add new entries. In this demo, a Dynamic Matrix displays a single column in which you can enter employee names.
Each matrix row displays an Edit Details button that opens a detail form for an individual employee. To add this button, handle the
Configure the Detail Form
Employee detail forms are built upon a Dynamic Panel question where each panel is an individual employee form. To configure the Dynamic Panel question, follow the steps below:
Specify a panel template.
templateTitleproperty to set a dynamic title and specify the
templateElementsarray to define panel content. In this demo, the Dynamic Panel template contains several static panels with survey questions.
Associate the Dynamic Panel with the Dynamic Matrix.
addPropertymethod to add a custom
detailFormproperty to Dynamic Matrix questions. This property will be used to associate a Dynamic Panel with a Dynamic Matrix question. In the survey JSON schema, set the
detailFormproperty to the Dynamic Panel's
Disallow users to add and remove panels.
In the use case you implement, the number of panels equals the number of entered employee names. Users should not be able to delete or add new panels. Disable the
(Optional) Configure minor usability enhancements.
Since you configured a dynamic title in step 1, you can hide the static title. Set the
"hidden". In addition, you can add a progress bar that indicates the number of filled out employee forms. To display the progress bar, set the
Configure the Summary Table
A summary table allows users to preview key employee data. This table is a Dynamic Matrix with read-only columns. To populate the columns, set their names to data fields that contain survey result values. In this demo, the matrix contains two columns that display values from the
phone data fields. You may also want to disable the
allowRemoveRows properties to disallow row addition and removal.
Share Data Between Form Parts
All parts of the Employee Information Form should save values to and take them from the same data fields. Use the
valueName property to implement this behavior. Set this property to the same value for those elements that should share data. In this demo, the Dynamic Panel and both Dynamic Matrix elements save data to an
employees array. Refer to the following help topic for more information: Merge Question Values.