Event Handlers (Form Submission)

'formSubmission': Handling form Submissions

The formSubmission LogUI event handler captures a submit event on a HTML form. It logs this event, and provides you with the ability to store additional data along with the event itself. This is particularly useful if you for example wish to store the value of an input field as part of the interaction log when the form is submitted.

Example Usage

Below is a JavaScript snippet that shows an example configuration mapping to demonstrate how to use the formSubmission LogUI event handler.

'query-submission': {
    selector: '#search-form',
    event: 'formSubmission',
    name: 'QUERY_SUBMITTED',
    properties: {
        includeValues: [
            {
                nameForLog: 'completeQuery',
                sourcer: 'elementProperty',
                selector: '#input-box',
                lookFor: 'value',
            }
        ]
    }
}

This configuration mapping is fired when the #search-form has been submitted. Inlcuded is an includeValues setting in the properties setting, which is similar to a metadata sourcer. Specify an additional selector setting to identify which element you wish to draw a value from. For example, the #input-box selector here picks an input field, and we use the elementProperty metadata sourcer to pull the value property out. This is then appended to the QUERY_SUBMITTED event as the value of completeQuery.