I'm trying to figure out why the onFormRender method is firing twice. I looked at this thread, but the issue there didn't seem to apply as this method isn't wrapped in the whenReady.
Below is the boiled down code that, for me, exhibits the behavior I'm describing. There is only one form being loaded, and there is only one div with the specified ID. I'm passing in a config object will all the particulars, but the form DOES load, so none of those are failing. I'm not seeing any errors, the only issue is the onFormRender method is firing two times. To test it, just throw in a <div> and add the ID to the form.render and put in correct values for your test forms. I've broken this down to a bare skeleton and it's still doing the same thing...
mktoFormLib.onload = function(){
MktoForms2.onFormRender(function(){
console.log('this method fires two times');
});
MktoForms2.loadForm(mktoConfig.baseURL, mktoConfig.munchkinId, mktoConfig.formId, function(form){
form.render(MktoForms2.$('#'+mktoConfig.containerId));
form.onSubmit(function(){});
form.onSuccess(function(values, followUpUrl){});
});
MktoForms2.whenReady(function(form){
//does some stuff
});
};
Here's the console result:
onFormRender isn't misbehaving. It's that you're rendering twice.
First is the automatic render that happens with loadForm, then you're manually rendering again inside your container. Not really a basic setup.
If you want to only take the onFormRender action one time, set a Boolean flag in the outer scope and exit early if it's true.