Page Comparison

...

Section

Column

now enables universal access to e-forms and workflows on tablets and smart phones in addition to desktop support on all standard browsers. iOS 6+ devices, iPad and iPhone, running mobile safari are supported. This tutorial will incorporate several features into an Employee On Boarding workflow. For example;

Touch screen wet signature - the new employee can sign to verify the information using their finger or a pointer.
Take advantage of device specific capabilities - you will see the correct date picker and keyboards pop-up on your mobile device
Screenflows - ability to further divide a screenflow into sections that better lend themselves to an iPad or iPhone using the PageBreak control
Ability to upload an existing image or a picture taken with the device camera to the e-form
Use the iPad's location services to fill in the address
Spaces that render in a device specific manner - support swipe gestures and customized icons
Enhanced Task List for mobile devices
Quick Approval feature - allows quick review of a task by the appropriate person with accept/reject buttons
Generate an additional Pixel Perfect PDF for the federal W - 4 form. It is important to note here that there is no limit on the number of PDFs that can be generated. For example, you can collect the information in your form once and then use it to fill in an unlimited amount of PDFs for the new employee i.e. -the federal W - 4 and the I - 9.

Info
You can download this tutorial as a PDF.

Please view the New Employee On Boarding video for an introduction to some of the exciting features we will be using in this tutorial.

We estimate about 2.5 to 3.0 hours for an experienced designer to complete this tutorial. It may take up to 4.0 hours if you are a new user.

Column

width	25%

On This Page:

Table of Contents

...

Expand

title	Click here to see how to create this rule

The Visual Rule Builder consists of 3 wizards:

Condition wizard - describe the conditions under which a set of actions should be executed
Action wizard - declare the actions that should be taken when the condition is true
Else Action wizard - declare the actions that should be taken when the condition is false

Click the to add the rule.
Name it Combine First Name and Initial
Select FirstPlusInitial in the first dropdown.
Select to in the second dropdown
Enter concat(FirstName + , " " + , MiddleInitial) in the third field. (values show in dropdown as you type the name of the controls)
Click Finish

Image Removed

Image Added

Click the icon to collapse the rule window
We will write the third rule to combine the address fields.

...

Allowances Form in the designer

Drag three Quantity controls from the palette and drop them on the designer canvas. Name them A_Allowance, C_Allowance and D_Allowance respectively. Type the instructions for A, C and D allowances as the labels for these controls. Add a fourth Quantity control where the result of the calculation of the total allowances can be stored. Name this control Total_Allowances and type "Total number of allowances you are claiming" as it's label. Uncheck the Enabled property for this control.
Add a Wet Signature control so the Employee can sign using the a track pad/mouse or a touch screen to verify the allowance selections entered into the form. This is what the new employee will see when signing. Set the label to Employee's Signature

Image Removed

Drag and drop a date control under the signature. Name it TodaysDate and uncheck the enabled property.
Here is a rule to populate the Today's Date control when the new employee signs.

...

title	Click here to see how to create this rule

The Visual Rule Builder consists of 3 wizards:

Condition wizard - describe the conditions under which a set of actions should be executed
Action wizard - declare the actions that should be taken when the condition is true
Else Action wizard - declare the actions that should be taken when the condition is false

...

Image Removed

...

We will add another rule that will add the values for the A_Allowance, C_Allowance and D_allowance controls and store it in the Total_Allowances field.

...

For this tutorial, we'll just create controls for Filing Status, Step 2: Multiple Jobs, and Step 3: Claim Dependent.

Tip
Download and install this example EOB workflow which includes a fully-mapped W-4.

Drag and Drop an Image control from the palette, and upload an image of the IRS logo or the top of the W-4 form to give your users a frame of reference when they are filling out this form.

Drag a Message Control into the form. In the Message Property, type

Code Block
Please complete the information below. A Federal W-4 Form will be generated. You will have the opportunity to review the form before submitting.

Change the Type to Bordered. On the Style tab, select Bold.

Drag and drop a Section control to your form and name it Filing Status

Drag a radio control into that section. Name it Federal Filing Status. Enter these options:

Code Block

Single_or_Married_filing_seperately=Single or Married filing seperately
Married_filing_jointly=Married filing jointly (or qualifying widow(er))
Head_of_Household=Head of Household (Check only if you're unmarried and pay more than half the costs of keeping up a home for yourself and a qualifying individual.)

Check the Required property.

Drag in another section and name it Step 2: Multiple Jobs.

Drag a checkbox control into the Step 2: Multiple Jobs section. Name it Multiple Jobs or Spouse works, and add just a single option:

Code Block

Only_2_Jobs=If there are only two jobs total, you may check this box. Do the same on From W-4 for the other job. This option is accurate for jobs with similar pay; otherwise, more tax than necessary may be withheld.

Drag in another section and name it Step 3: Claim Dependents.
Drag two quantity controls inside that section, named "Number of Qualifying Children Under Age 17" and "Number of Other Dependents".
Drag three number controls inside that same section. Uncheck the Required and Enabled properties (we will set them using rules later, and this is what we'll map to the W-4.) Label them "Dependent Child Calculation", "Other Dependent Calculation", and "Claim Dependents Total" (name Step3TOTAL used in rule below).

Add a Wet Signature control so the Employee can sign using the a track pad/mouse or a touch screen to verify the allowance selections entered into the form. This is what the new employee will see when signing. Set the label to Employee's Signature

Image Added

Drag and drop a date control under the signature. Name it TodaysDate and uncheck the enabled property.
Here is a rule to populate the Today's Date control when the new employee signs.

Expand

title	Click here to see how to create this rule

The Visual Rule Builder consists of 3 wizards:

Condition wizard - describe the conditions under which a set of actions should be executed
Action wizard - declare the actions that should be taken when the condition is true
Else Action wizard - declare the actions that should be taken when the condition is false

Click on the Image Added Rules icon on the designer toolbar to access the Rules Editor.
Click the Image Addedto add the rule.
Name it Populate Today's Date when the new employee signs.
Click Add Condition - this is the Condition wizard
Select EmployeeSSignature from the first dropdown.
Select isFilled from the second dropdown
Click Next
Select TodaySDatein the first dropdown.
Select to in the second dropdown
Start typing today and select function today() from the dropdown
Click Next and go to false condition
Select TodaySDatein the first dropdown.
Select to empty in the second dropdown
Click Finish

Image Added

We will use rules to calculate the dependent allowances.

Expand

title	Click here to see how to create these rules

Calculate Dependents Rule

Click the Image Addedto add the rule.
Name it Compute Total Allowances
Click Rule Code, then Edit Code.

Paste this text into the code box.

Code Block

var event = form.load;
if (Boolean(NumberOfOtherDependents.value)) {
  DependentCalculation.value = (NumberOfOtherDependents.value * 500);
} else {
  DependentCalculation.value = null;
}
if (Boolean(NumberOfQualifyingChildren.value)) {
  ChildrenCalculation.value = (NumberOfQualifyingChildren.value * 2000);
} else {
  ChildrenCalculation.value = null;
}

Tip
If you prefer to use the Visual Rule Builder, simple create two separate rules; one the sets DependentCalculation to NumberofOtherDependents * 500, and a second that sets Children Calculation to NumberOfQualifyingChildren * 2000.

The Visual Rule Builder consists of 3 wizards:

Condition wizard - describe the conditions under which a set of actions should be executed
Action wizard - declare the actions that should be taken when the condition is true
Else Action wizard - declare the actions that should be taken when the condition is false

Click the Image Removedto add the rule.
Name it Compute Total Allowances
Click Next - to take you to the Action wizard
Select Total_Allowance from the first dropdown.Click the Image Addedto add the rule.
Name it Calculate Dependents Total
Click Run Builder
On the Condition Wizard, select DependentCalculation - is filled.
Add another Condition, select ChildrenCalculation - is filled.
Click Edit Logic. Change the "and" to "or". Click Save. This rule should run if either field is filled.
Click Next.
Select Step3TOTAL from the first dropdown. (or replace Step3TOTAL with your control's name)
Select to from the second dropdown
Type Sum in the third field. The function shows in the dropdown. Select function Sum.
Type A_Allowance, C_Allowance, D_Allowance DependentCalculation, ChildrenCalculation inside the sum bracket.
Close the function.Click Next.
On the else action wizard, set Step3TOTAL to empty.
Click Finish.

Image RemovedImage Added

Be sure to save your form by clicking on the save and exit icon in the designer.
You can test this form by clicking on the Test button on the Forms Home Page. The Today's Date field should be populated with the current date when the new employee signs. The sum of the values entered in A_allowance, B_allowance,and C_allowance will dependent allowance values will be calculated and display in the Total_Allowances total field.

Create the Education Form

...

Log in as the designer. Click on the Spaces tab.
Click Add to create a new space, type a Space ID and Space Name, and then click Create. You will be directed to the space designer.
Since we set the state of the Employee On Boarding workflow to Production in a previous step, it will automatically be included, along with the Task List as menu items in the newly created space.
Verify that the left panel is hidden. If not, click the icon to hide it.
Select regular for the form width from the Min Width dropdown on the Property pane.
If your tenant is in the cloud, click the Save and Exit icon and proceed to the Test the Employee On Boarding workflow section.
If you are using an in-house installation,
1. Click the menu edit icon. Replace the <localhost:8082> in the urls for the Task List and the Employee On Boarding workflow with your server name and port. If you are concerned about portability to another system, make the URL's relative by removing the protocol, server and port information.
2. Click the Save and Exit icon to save the changes and proceed to the Test the Employee On Boarding workflow section.

...

Versions Compared

Old Version 3

New Version Current

Key

Create the Education Form