Cognito Forms logo

Client-side events

You can access client-side events in order to hook into the lifecycle of a form in the browser.  

Events

beforeSubmit.cognito

The beforeSubmit event is raised after the user clicks the “Submit” button, but before the form is submitted to the Cognito Forms servers.  Users may catch this event to perform custom validation, or display a message to the user before the form is submitted.  This event is preventable.

Payload

Property

Type

Description

hasErrors

Boolean

Indicates whether or not there is a validation messaging being displayed.

entry

Object

An object representing the entry to be submitted.

 

afterSubmit.cognito

The afterSubmit event is raised after the form is submitted but before the confirmation page is displayed.

Payload

Property

Type

Description

entry

Object

An object representing the entry to be submitted.

 

beforeNavigate.cognito

The navigate event is raised when the user attempts to move forward or back a page in the form.  This event is preventable.

Payload

Property

Type

Description

direction

String

Indicates the direction (forward or backward) that the user is navigating on the form.

sourcePage

Object

The page that the user is currently on.

sourcePage.number

Number

The current page number.

sourcePage.name

String

The current page name.

sourcePage.title

String

The current page title.

destinationPage

Object

The page to which the user is navigating.

destinationPage.number

Number

The destination page number.

destinationPage.name

String

The destination page name.

destinationPage.title

String

The destination page title.

 

afterNavigate.cognito

This event is raised once a page navigation has completed.

Payload

Property

Type

Description

direction

String

Indicates the direction (forward or backward) that the user is navigating on the form.

sourcePage

Object

The page that the user is currently on.

sourcePage.number

Number

The current page number.

sourcePage.name

String

The current page name.

sourcePage.title

String

The current page title.

 

uploadFile.cognito

The uploadFile event is raised every time a user upload a file to the form.  Users may catch this event in order to display additional data about the file or a confirmation message.

Payload

Property

Type

Description

file

Object

The file which was uploaded.

file.name

String

The name of the uploaded file.

file.id

String

The Cognito Forms assigned id of the file.

file.size

Number

The file size in bytes.

 

Example

The code below captures the beforeSubmit event and cancels the entry submission if the first name that was entered is “Bob”.

   <div class="cognito">

       <script src="https://services.cognitoforms.com/s/beDsdRSO50OQKDy-LoN0Qw"></script>

       <script>Cognito.load("forms", { id: "33" }, { success: function() { ExoJQuery(function() {

           ExoJQuery(document)

               .on('beforeSubmit.cognito', function(e, data) {

                   if (data.entry.Name.First && data.entry.Name.First.toLowerCase() === 'bob') {

                       e.preventDefault();

}

               });

       }); } });</script>

   </div>
Printable View