jQuery calls stopped working?

[Anonymous]

Hi,

I was trying to create some lightbox pop up forms for a landing pageusing jQuery. While my previously made lightboxes are functioning in Design Studio and web browsers any new one I create does not actively call the jQuery function.

I have tried to duplicate the code from a working lightbox into another page and the HTML code for the javascript and the new duplicate fails to respond to the click. I even tried to copy the code from the original element and put it into an identical element and then deleting the original and the page would not load the form from the new link with the exact same code of the original.

Had anyone else had this issue and know if I may be missing something obvious that would cause a new link not to function with jQuery?

Thanks,

Dan

[Sheila_Baker__2]

Dan,
   The way that Marketo has designed the Forms 2.0 forms is significantly different from the Forms 1.0 forms.   Perhaps your old forms are built on the Forms 1.0 editor. 

   The Forms 2.0 forms usually don't work with any preexisting JavaScript code.   That code will need to be rewritten or achieved in a different way.
  
    There is an article on the community for one way to use the Forms 2.0 forms to support lightboxes: https://community.marketo.com/MarketoArticle?id=kA050000000LHCyCAO

Best,
-Pam

[Anonymous]

Thanks Pam,

I got everything working with a new set of Javascript for the lightboxes with a conditional check to only allow pop-up on the first click to avoid the nuissance of the multiple forms popping up with multiple clicks.

I was just trying to figure out what had happened in a weeks time that the jQuery code stopped working for new light boxes but still worked for the old ones.

The forms were all built with Forms 2.0 so it must be something to do with the jQuery, but as I said its been fixed with javascript that has been working with all of my forms and pages since I ran into this interesting problem.

But here is what I am using now:

 <script src="//app-xxxx.marketo.com/js/forms2/js/forms2.js"></script>
<form id="mktoForm_1111"></form>

<script type="text/javascript">
var clickOnce = false;

function formFunctionOne() {
if(!clickOnce){
                clickOnce = true;
MktoForms2.loadForm("//app-xxxx.marketo.com", "222-yyy-333", 1111, function (form)
{
clickOnce = false;
MktoForms2.lightbox(form).show();
form.onSuccess(function(values, followUpUrl){
location.href = "http://www.google.com";
return false;});});
}
}
</script>

So what I have it doing is call the form and set the clickOnce variable to true so it cannot call the form again. Then once the form is loaded it sets the clickOnce variable back to false so if the lightbox is closed without submission it can be reloaded (otherwise the page needs to be refreshed or reloaded to get it back). Once the form is sucessfully submitted the visitor is redirected to the linked asset page for a pdf, video or thank you landing page.

I don't mean to go back to the jQuery method since it doesn't work as well as what the community and the Forms 2.0 API document. I was just curious as to why it stopped working over a weekend.
 

Thank you for the suggestion and input,

Dan