Jot form display jQuery confliction

  • Profile Image
    EAPLtd
    Asked on June 04, 2021 at 10:05 AM

    Hi Team
    I have used Jot form in my site. But there is some jQuery confliction see the screenshot:
    Here is the URL:
    https://appleandpears.host100.co.uk/members/tonnage-input/

    Please check and let me know how I can fix this issue.

    Thanks

    1622814689_60ba2fe139554_

  • Profile Image
    JohnRex
    Answered on June 04, 2021 at 11:50 AM

    I have examined the webpage you provided where the form is embedded. I would recommend re-embedding the form using one of these methods:

    1.)  Please try applying the "noConflict" method as shown in the images below?

    1584231302Screenshot from 2020-03-15 02-

    In addition, if the issue persists after trying the noConflict code, you can also try these noConflict codes:

    <script type="text/javascript"> $.noConflict();</script>

    or:

    <script type="text/javascript"> jQuery.noConflict();</script>

    You should find the last line of JQuery code prior to the Jotform's code and add this function below. I'm referring to finding the JQuery line on the page where the form will be added.

    2) Or embed the form as an iframe instead. We have a guide on how to get your form's iFrame embed code here: https://www.jotform.com/help/148-Getting-the-form-iFrame-code


  • Profile Image
    EAPLtd
    Answered on June 07, 2021 at 02:28 AM

    Hi Team
    I have added noconflict function. But its not working. See the screenshot:
    https://prnt.sc/14h9i6j

    Thanks

  • Profile Image
    Vick_W
    Answered on June 07, 2021 at 04:51 AM

    Hi there,

    Could you please embed your form using iFrame embed code? Please follow the instructions in the guide below:

    https://www.jotform.com/help/148-Getting-the-form-iFrame-code

    This will load the form in a separate iFrame and it will not create any conflicts with the existing scripts you already have on your website.

    Let us know if you need further assistance.

    Thanks

  • Profile Image
    EAPLtd
    Answered on June 10, 2021 at 05:14 AM

    Hi Team
    I can't use Embed code . Because in Email field I have fetched this from other pages. If I have used Embed code then we can't fetch data.
    Thanks

  • Profile Image
    Vick_W
    Answered on June 10, 2021 at 06:42 AM

    Hi there,

    Please try adding the following to the end of the page above the </body>:

    <script>jQuery.noConflict();</script>

    Let us know if you need further assistance.

    Thanks

  • Profile Image
    EAPLtd
    Answered on June 14, 2021 at 12:06 PM

    Hi Team
    I have added above code above the </body> tags. Jotform working fine but it breaks othr site JS like menu click toggle etc. I have try to added above script in header but its not working.
    So please help me to resolve this issue.
    Thanks

  • Profile Image
    Sam_G
    Answered on June 14, 2021 at 02:45 PM

    Hello EAPLtd,

    Have you recently installed any plugins? Can you please try disabling them and then check if they are causing the menu to stop working.

    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 the 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.