How to Track Form Submissions on Dynamic/Ajax Forms in Wingify

To track form submissions on dynamic or AJAX forms, use the following API:

window.Wingify = window.Wingify || [];
window.Wingify.push(['nls.formAnalysis.markSuccess', < REPLACE_THIS_WITH_YOUR_FORM_INSTANCE > , < IS_FORM_SUCCESS_VALUE > ])

where,

• <IS_FORM_SUCCESS_VALUE> This value could be 1 (for success) or 0 (for failure) based on whether the form submission is success or failure.
• <REPLACE_THIS_WITH_YOUR_FORM_INSTANCE> This is your form instance (jquery or JavaScript).

For example, let’s say this is the HTML code of your form:

<form id=“my-form-id” class=“my-form-class”>
………..
</form>

Get Form Instance

Add the following JavaScript code to your website for getting form instance:

If you don't want the code snippets to be hardcoded, you can use any tag manager to implement them.

In case of using pure JavaScript:

var formInstance = document.getElementById('my-form-id');

In case of using jQuery:

// Getting by form id var formInstance = $('#my-form-id'); // OR//Getting by form class var formInstance = $('.my-form-class');

Track Success and Error Event of the Form

Add the following JavaScript code to your website to start tracking the success and error event of the form:

If your form submission is successful, use this code in the form success callback function of your form:

window.Wingify = window.Wingify || []; 
window.Wingify.push(['nls.formAnalysis.markSuccess', formInstance, 1]);

If your form submission is a failure, use this code in the form error callback function of your form:

window.Wingify = window.Wingify || []; 
window.Wingify.push(['nls.formAnalysis.markSuccess', formInstance, 0]);