Skip to content
A form activity & validation message observer
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
.gitignore
example-form.html
form-style.css
jquery-form-observer.js
readme.markdown

readme.markdown

jQuery Form Observer

Observes the human interaction with a form, collecting details like which fields the visitor has interacted with, what validation messages they encounter.

Uses jQuery 1.4.2.

Usage

// Initiate form observer on a form
$('form.signup')
    .observeForm({
        // The selector for validation messages 
        // (relative to the form selector)
        validation: 'label.error'
    });

// Register for the form-observer events
$('form.signup')
    .bind('form.validation', function(e, msg){
        console.log(msg.type + '[' + msg.name + '] ' + msg.error);
    })
    .bind('form.activity', function(e, msg){
        console.log(msg.type + '[' + msg.name + ']: User Activity');
    });

Validation messages

The eventType is form.validation. The data structure passed through for validation messages looks as follows:

{
    type:  'validation.server', // the type of message
    name:  'email',             // The form field name
    label: 'Email Address',     // The form field label
    error: 'The error message displayed to the visitor'
}

For javascript validation messages the type becomes validation.javascript

Activity messages

The eventType is form.activity. The data structure for field activity messages looks as follows:

{
    type: 'activity.field',
    name: 'email'
}

Demonstration

Take a look at example-form.html for a working demonstation of the form observer.

Something went wrong with that request. Please try again.