Conditions not working properly on WP Site

  • therobotnextdoor
    Asked on March 9, 2015 at 10:27 PM

    I've just realized that my conditions aren't working when the form is embedded on my website. They seem to work fine in the "Preview" section of the form, but they aren't behaving at all on my site.

    The form is here: http://form.jotform.us/form/31604644465151

    It's posted on my site here: https://www.elliottinsuranceagents.com/business-insurance/business-insurance-quote/business-auto-quote/

    I've had funny things happen in the past because it's a secure site (https). Could this be the issue?

    Any help will be greatly appreciated.

  • Ashwin JotForm Support
    Replied on March 10, 2015 at 3:06 AM

    Hello therobotnextdoor,

    I did check your web page where you have embedded your form and the conditions seems to work fine. Please check the screenshot below:

    Conditions not working properly on WP Site Image 1 Screenshot 20

     

    With which browser you are having this issue with? Is there any specific condition which is not working or none of the conditions are working for you?

    Please be noted that sometime when there is a code conflict between form scripts and other scripts of your web page, the condition does not work. In your case, the condition seems to work as expected in the embedded form. I will suggest you to re-embed your form using its iFrame embed code and see if that solves your problem. The following guide should help you grab your form's iFrame embed code:  https://www.jotform.com/help/148-Getting-the-Form-iFrame-Code 

    Do get back to us if the issue persists.

    Thank you!

  • therobotnextdoor
    Replied on March 10, 2015 at 9:57 AM

    I'm using Firefox 36.0.1, and it still isn't working for me. I did try it on my phone, and the conditions are working there.

    I don't like the iFrame option. I've tried it in the past and have had issues with formatting. Mainly, when I do have a lot of conditions like this, the spacing on the page gets weird. I either have way too much space, or my form gets cut off.

  • Carina
    Replied on March 10, 2015 at 12:29 PM

    I tested the form and had the same results with the embed version on Firefox, IExplorer and Opera:

    Conditions not working properly on WP Site Image 1 Screenshot 30

    It worked fine on Chrome.

    The standalone version worked fine:

    Conditions not working properly on WP Site Image 2 Screenshot 41

    You are using a Wordpress site so this is likely a conflict between the form and the features of the site.

    Which embedding method are you using?

    I will inspect the code to try to detect the cause of the conflict.

    Let us know if we can assist you further.   

  • therobotnextdoor
    Replied on March 10, 2015 at 12:53 PM

    This is the code I've used to embed the form:

    I chose the Wordpress option under "Embed" and basically just changed "http://form" to "https://secure".

    I was working when I first embedded the form. The one major change I've made to the site is changing the theme.

  • therobotnextdoor
    Replied on March 10, 2015 at 1:09 PM

    I think I might have just fixed it...

    I noticed that the sidebar had turned on for that page since I've changed themes. I turned it off (not for the sake of the form, but just for the sake of aesthetics), and the conditions are working now! Just to test, I turned the sidebar back on, and the same issue came back.

    There was nothing in my sidebar. Any ideas why this may have happened? I'm using Elegant Theme's Divi Theme without page builder.

  • therobotnextdoor
    Replied on March 10, 2015 at 1:11 PM

    I've just checked a form on another page on the same sight, and the form does work with the sidebar turned on. Conditions and all.

  • Carina
    Replied on March 10, 2015 at 2:16 PM

    Unfortunately Wordpress is conflict prone. I'm glad that you managed to make the work conditions.

    Does this other page has the same exact features on? If you wish you can let us know the other page url and we'll take a look.

    Let us know if we can assist you further.

  • therobotnextdoor
    Replied on March 24, 2015 at 6:45 PM

    This is causing trouble again. I've moved forms to another page to consolidate them. I've done this with two sets of forms.

    These are the pages that are broken:

    https://www.elliottinsuranceagents.com/business-insurance/business-insurance-quote/

    https://www.elliottinsuranceagents.com/personal-insurance/personal-insurance-quote/

     

     

  • Elton Support Team Lead
    Replied on March 24, 2015 at 11:38 PM

    @therobotnextdoor

    The two pages you have provided with us are seems to be working just fine on Chrome. However it does not work properly in Firefox on the initial load of the page but when you reload it, it will start to work normally as usual. This occurrence is commonly caused by script conflicts. I'm afraid there's no other easier solution other than using iframe embed code to prevent script conflicts as also suggested by my colleague on his first response. I'm not sure if this helps but you may also try using Jotform WP Plugin and see if this makes any difference. http://apps.jotform.com/app/wordpress_embed_form

    Let us know if you need further help. Thanks!

  • therobotnextdoor
    Replied on March 25, 2015 at 4:08 PM

    The plugin doesn't seem to support secure forms. And iFrame doesn't work well with conditions because the size changes so much.

    I've abandoned the idea altogether just linking to the form itself.

  • Ben
    Replied on March 25, 2015 at 5:36 PM

    I would like to still help you set it all up and would appreciate if you would be interested in the same as well.

    The js embed code that you have used before is there to actually create the iframe element so the only thing different from iframe element itself is that it is prone to conflicts while creating it.

    On the other hand the script code will take a different width for the iframe it creates than the iframe you add, so this is most likely the reason why you are seeing this.

    This is because the WordPress option to add paragraphs to the text, so when you add iframe, you most like end up with the iframe within a paragraph, while when you add js embed script, you end up with the iframe outside of the paragraph.

    There are 2 ways to resolve this:

    1. adding a bit of CSS to the iframe itself to expand it and if needed to the form itself and this is something that we would be happy to assist with

    2. using .noConflict() jQuery function.

    I personally would always go with the first option, but the second option is using the function built to resolve conflicts that are there when using libraries.

    My colleague has explained this function on this thread: How to prevent conflict between JotForm lightbox/feedback and jQuery?, but if you have any issues with this do let us know about it here and we would be happy to assist.

    If possible, I would suggest creating a hidden page on your website that we would be able to access and see the jotform at with iframe code (preferably) and help you set it all up just right :)

    Do let us know of your preferences