Skip to main content
Gabriel_Ortiz
Level 2
Oct 24, 2019 4:30 PM UTC
Question

How to catch form submission errors using JavaScript API

Doesn't anyone know how to catch marketo submission errors using the JavaScript API, when `save2` does not POST?

We are submitting our Marketo forms using the JS API, and are having issues with payload not actually being delivered to Marketo. I've found that the `MktoForms2` object is loading correctly, but in some instances in our production environment, the `submit()` and `onSuccess()` methods are not executing. I've tentatively arrived at the conclusion that there is some kind of error. I can tell the difference because I'm not seeing a POST call to `index.php/leadCapture/save2` in Network. So I want to know why this payload doesn't being delivered!

What's worse is this issue only appears to be happening in our production environment, and not in out staging or dev. So naturally it's baffling that the same code would execute differently.

Here is the model function for submitting in the background:

proto.marketoPayload =  function (marketoPayload) {

return new Promise( (resolve, reject)=>{

//checks to make sure the Payload exists and that there is a marketo form.
// The marketo script will always load, but sometimes here are no actual forms
if( _model.empty( marketoPayload ) || _model.empty( MktoForms2.allForms() ) ){

//define the error message for email
const marketoError = `marketo error, NO PAYLOAD: ${_model.empty( marketoPayload)}, EXECUTION FAILURE: ${_model.empty( MktoForms2.allForms() ) } `;

//send error message from the function
console.log( marketoError );

//update the payload
APIObj.wp_email_subject = "Failed Marketo Submission";
APIObj.error_message = marketoError;
APIObj.wp_email_message = JSON.stringify(APIObj, null, 4);

//send Fail email
var sendEmail = _model.model__handleEmailSubmission(marketoPayload)
.always((response) => {
console.log('marketo fail ', response);

});

//exit this promise
reject();
}

//marketo exists and is working, let's actually deliver the payload
MktoForms2.whenReady( (form )=>{

this.debug( 'Payload Success:', marketoPayload);
this.debug( 'this is the form', form );

form.addHiddenFields(marketoPayload);

form.onSuccess( (vals)=> {

console.log( 'Marketo Success: ', vals );

return false;

});

form.submit();

APIObj.wp_email_message = JSON.stringify(marketoPayload, null, 4);
//send success email
var sendEmail = _model.model__handleEmailSubmission(marketoPayload)
.always((response) => {
console.log('email response ', response);
});

resolve();

} ); //end callback


} ); //end promise


};

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

4 replies

SanfordWhiteman
User Group Leader
User Group Leader
Oct 24, 2019 5:34 PM UTC

See https://blog.teknkl.com/adding-a-network-server-error-handler-to-marketo-forms/.

Also, the Advanced Editor here has a proper syntax highlighter for JS, please use that.

Translate
Gabriel_Ortiz
Level 2
Oct 24, 2019 10:47 PM UTC

Cool! I'm going to give this a run! Thanks!

Do you know of any reasons why `submit()` or `onSuccess()` would not execute? We of course are submitting the marketo form in the background - so the `MktoForms2` script isn't watching for form submissions that isn't it's own, correct? Any info you have would help so much. Thanks!

Translate
SanfordWhiteman
User Group Leader
User Group Leader
Oct 25, 2019 4:13 AM UTC
Do you know of any reasons why `submit()` or `onSuccess()` would not execute?

There's no prevailing reason other than tracking protection plugins/features, which will block submission if they list *.marketo.com.

o the `MktoForms2` script isn't watching for form submissions that isn't it's own, correct?

Only its own forms, certainly.

Translate