Rich-text Reply
Highlighted

JS for form submit not working

pinksharpii 08-10-17

JS for form submit not working

We have a Page on a client site that is setup in an Experiment. There is a form on this page that we'd like to track submissions for for Conversions. I created an Event. The Event is assigned in Metrics. I put the code we were given in the Shared Code section as follows:

 

window['optimizely'] = window['optimizely'] || [];
console.log($('.gform_wrapper form'));
$('.gform_wrapper form').submit(function(){
console.log('tracked');
window['optimizely'].push({
type: "event",
eventName: "requestQuoteSubmit"
});
});

 

But it's not even logging the message that's outside the .submit(). I've also tried .on('submit'); And we are not seeing any console logs nor anything show up for conversions for this Event. The documentation says we can track form submissions but doesn't specifically explain how to do it.

JasonDahlin 08-11-17
 

Re: JS for form submit not working

Try window-scoping your code.  When run inside Optimizely, a non-window-scoped "console" command will cause your code to break.

 

e.g., change this:

console.log($('.gform_wrapper form'));

to this:

window.console.log($('.gform_wrapper form'));

 

--Jason Dahlin
Analytics and Testing Guru Smiley Happy
Experimentation Hero
pinksharpii 08-11-17
 

Re: JS for form submit not working

I'm not testing this in Optimizely preview though. This is on the actual site after it's been published.
JasonDahlin 08-11-17
 

Re: JS for form submit not working

Preview or not, "console" does not exist within code that runs inside Optimizely.  You must change it to be window-scoped.

--Jason Dahlin
Analytics and Testing Guru Smiley Happy
Experimentation Hero
JasonDahlin 08-11-17
 

Re: JS for form submit not working

Another option for you would be to listen to the click of the button (if the form has validation, this will work if you want to know how many users attempt to submit the form and not how many successful submits there are).

 

To do this, create a click-based goal that runs on a selector such as the following:

.gform_button[value="Submit"]
--Jason Dahlin
Analytics and Testing Guru Smiley Happy
Experimentation Hero
pinksharpii 08-11-17
 

Re: JS for form submit not working

That's not going to work if the user hits enter button to submit the form though.
JasonDahlin 08-11-17
 

Re: JS for form submit not working

If your form allows that, then yes, that won't work for this scenario.
Have you had a chance to try window-scoping the console messages? If so, and it is still not working, can you share a link to the page where this form runs?
--Jason Dahlin
Analytics and Testing Guru Smiley Happy
Experimentation Hero
pinksharpii 08-23-17
 

Re: JS for form submit not working

I got this to work by putting the .submit() event in our site's main.js rather than inside Optimizely code.