Skip to main content

I’ve added hotjar to our unbounce pages via GTM and the form fields track great, except for form submission.  We use confirmation popups and can’t get hotjar to fire on a submit. 


Hotjar suggests (http://docs.hotjar.com/v1.0/docs/using-javascript-to-handle-form-submissions) overriding the form’s submit function with javascript and adding functions to fire the formSubmitSuccessful and formSubmitFailed events, but I can’t see where I can do that?


Any ideas?  I’ve attached their code to the click event on the submit button, but that’s just a hack, since it will still fire on a form that hasn’t passed validation.

Load this as its own script (besides the normal Hotjar script). I prefer to do this under Settings > Scripts. Make sure you choose which pages to apply the script to.


Best,

Brian


<script type="text/javascript">

lp.jQuery(function($) {

	function notifyHotjar() {

		lp.jQuery('.lp-pom-form form').submit();

		hj('formSubmit' + ($('.lp-pom-form form').valid() ? 'Successful' : 'Failed'));

	}



	$('.lp-pom-form .lp-pom-button')

		.unbind('click tap touchstart')

		.bind('click.formSubmit', notifyHotjar); 



	$('form')

		.unbind('keypress')

		.bind('keypress.formSubmit', function(e) {

			if(e.which === 13 && e.target.nodeName.toLowerCase() !== 'textarea' ) {

				notifyHotjar();

			}

		});

});

Hello Brian,


I am new to coding, could you please explain step by step where this code needs to installed. I have one landing page and a form. When the submit button for form is press a pop up confirmation box pops up on the same page. Thanks.

Reply


Terms & ConditionsCookie settings