.js killing form submit

[Anonymous]

I'm trying to create a simple javascript solution for a "not you" link to go on a landing page that contains a form. When somebody clicks the "not me" link, the form data is cleared and cookied data is cleared. Theoretically the script below seemed fine. But in a test, we discovered that after somebody clicks "not me", then fills out the form, there's a glitch. When they hit submit, it goes to "please wait" but that's it. Nothing seems to submit.

The script:

// <![CDATA[   

$(document).ready(function(){

     // If 'not me' clicked, remove Marketo cookies, prefill, etc.

     $( "#mktFrmReset" ).click(function() {

       // alert("clicked"); this worked

         // $("#_mkt_trk").val(''); did not work

       $(".mktoField").val('');

       $(".mktoCheckboxList").val('');

       $('input[name=fAMDBreachGrade]').attr('checked',false);

       $('input[name=fAMDWhyNoBreachPlan]').attr('checked',false);

        mktoPreFillFields = {};

        $(".mktoForm")[0].reset();

        document.cookie = '_mkto_trk=NULL; expires=-1; path=/; domain=.idt911.com';

     });

    }); 

  // ]]>

[SanfordWhiteman]

First, you must not use DOM ready events with Marketo forms. (jQ ready() is an abstraction of DOMContentLoaded.) Only use the Forms 2.0 API event model, or else you will encounter race conditions and unpredictable results in the real world. There's a lot of buggy code out there that acts as if you can use substitute generic ready() for MktoForms2.whenReady(). You can't: Marketo forms are loaded asynchronously, explicitly outside of the initial DOM.

You should also use the Forms 2.0 API data model (getValues/setValues) to the fullest extent possible instead of using direct DOM element manipulation. It's true that you'll need to go straight to the elements for advanced features, but you should build "API first" to reduce surprises.

Please provide the exact functional requirements, rather than an attempted implementation, and I'll show you how to do it right!

[Anonymous]

Forgive me if there's a detail I left out - my first paragraph in the initial post is essentially my functional requirements. We have a landing page with a form on it - for reference, sitting here with the non-working script - rather than the "not you" button going to a new page/new form set to not autopopulate (per a tutorial on setting up subscription pages) I was hoping to avoid creating extra assets by just clearing any form fields that have data, and clearing any cookie that might be populating those fields - for situations where maybe two people use a computer, etc. 

As you may've guessed, judging from your DOM ready cautioning above, I referenced this conversation: https://nation.marketo.com/message/39494#comment-39494, which highlights Rafael's solution as the correct answer. That's why I tried his script.