Embedding the Widget

The Closing Docs offers an embedded widget for creating automated income verification requests and screening reports from directly within your existing workflow.

To see a demo of our embedded widget, click here and click on the "Show Me" button.

In order to embed the widget into your page, first add our javascript onto your page by adding the following <script> tag into the <head> section of your page.

<head>
<script src="https://cdn.theclosingdocs.com/paycheck/v1/paycheck.js"></script>
</head>

Then, initialize your widget handler with the following parameters, and call the open() function on the handler:

<script type="text/javascript">
var paycheckHandler = paycheck.create({
clientId: 'CLIENT_ID',
env: 'development',
applicant: {
firstName: 'John',
lastName: 'Smith',
email: 'johnsmith@gmail.com'
},
property: {
streetAddress: '1234 Pine St.',
city: 'Seattle',
state: 'Washington',
zipCode: '98105',
unit: '3'
},
monthlyRent: 1000,
onSuccess: function(event) {
console.log(event);
},
onBankNotSupported: function(event) {
console.log(event);
},
webhookUrl: 'https://samplewebsite.com/webhook'
});
function onClick() {
paycheckHandler.open();
}
</script>

Widget Parameters Reference

Field

Type

Required?

Description

clientId

string

yes

The Client ID provided to you by The Closing Docs, which can be found here.

env

string

yes

The environment of the widget. Valid options are “development”, and “production”. Development points to our staging server.

applicant

Applicant

yes

The applicant’s information that will be displayed on the report.

property

Property

yes

The property’s address will be displayed in the screening workflow to let the applicant know they are in the right place.

monthlyRent

number

no (Recommended)

The monthly rent in dollars is used to calculate the net income to rent ratio and approval recommendation. If left blank, no recommendation will be created.

onSuccess

function(event: SuccessEvent)

no

A function that is called when the applicant shares their income report.

onBankNotSupported

function(event: BankNotSupportedEvent)

no

A function that is called when the applicant’s bank is not supported.

webhookUrl

string

no

The url that will receive webhook notifications for the screening group created

Applicant Schema

Field

Type

Required?

Description

firstName

string

yes

The applicant's first name

lastName

string

yes

The applicant's last name

email

string

yes

The applicant's email

Property Schema

Field

Type

Required?

Description

streetAddress

string

yes

The property’s street address

city

string

yes

The property’s city

state

string

yes

The property’s state fully spelled out. No initials

zipCode

string

yes

The property’s zip code

unit

string

no

The property’s unit number, if available

SuccessEvent Schema

Field

Type

Description

screeningGroupId

string

The created screening group ID

screeningId

string

The created screening ID

BankNotSupportedEvent Schema

Field

Type

Description

missingBank

string

The applicant's missing bank

Getting the Report URL

Once the applicant has completed the screening and the onSuccess handler has been created, the report needs to be created. This can take a few seconds, so we recommend waiting for the SCREENING_GROUP_COMPLETED webhook to fire before trying to get the report. You can obtain the applicant’s report through our API.