How to resolve the conflict between JotForm and jQuery?

  • harryjamestailoring
    Asked on June 15, 2018 at 6:32 AM

    So...Its clear that there are conflict issues when using jotform with jquery or sites that use jquery. For instance, on my site, if I use the source code method (which I HAVE to because I need to access click events on inputs of the form) it breaks the javascript running in squarespace as you can see once it comes time to fill out a custom product form before adding to cart. https://www.harryjamestailoring.com/cloths/cavani-brown-check-tk35y-aagcn 

    It also breaks any javascript I have running at the bottom of the page. If I load script for the page, it breaks the form. But what if I bound a click event to the submit button of the form that created a new code block that was filled with the latest jquery snippet to reclaim the $ selector for the following steps on the page? Might that fix it? By then, the form would have already been submitted and not needed anymore. So it's ok if the new code breaks it.

    Jotform Thread 1500461 Screenshot
  • harryjamestailoring
    Replied on June 15, 2018 at 6:38 AM

    https://www.harryjamestailoring.com/cloths/cavani-brown-check-tk35y-aagcn

    Not quite sure why the first link didn't work trying again

  • Kevin Support Team Lead
    Replied on June 15, 2018 at 9:21 AM

    You may try the noConflict function of jQuery, please find more details here: https://api.jquery.com/jquery.noconflict/ 

    I hope this helps. 

  • harryjamestailoring
    Replied on June 18, 2018 at 2:03 AM

    Could you please be more specific on what to put in the code and where to put it? I have tried to place the $.noconflict() code in a few different places but it doesnt seem to have any effect.

  • Ashwin JotForm Support
    Replied on June 18, 2018 at 5:39 AM

    Please note that all script code of form needs to go under the noconflict script tag:

    <script>

    $.noConflict();

    All script code of JotFrom needs to be added here. 

    </script>

    The best way to solve this problem is to embed your form using its iFrame embed code. Please note that iFrame embed code will rule out any conflict issue between your form scripts and other scripts of your webpage. You may like to take a look at the following guide on how to grab your form's iFrame embed code:  https://www.jotform.com/help/148-Getting-the-Form-iFrame-Code 

    Hope this helps.

    Do embed your form using its iFrame embed code and see if that solves your problem.