What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Bug: Hidden Fields lag on JS embed forms

    Asked by thespanishfactory on September 10, 2013 at 09:18 PM

    I have a problem with all my forms with conditional fields. They are blinking when the page is load, giving a very poor user experience. 

    I really would like to fix this for good.

    http://www.thespanishfactory.co.uk/pricing/student-centre.html

    Many thanks

    My Forms problem thanks
  • Profile Image

    Answered by khrisell on September 10, 2013 at 09:40 PM

    Hello,

    I went to your website/page, and I have tested your form and I am unable to replicate the issue.

    Kindly see the video I have created for you.

    May I know if which from the two you are having a blinking problem?.

    I have cleared your form caches and kindly clear your browser cache and cookies aswell.

     

    Have you tried using other browser?

    If problem persists please do let us know so that we could further investigate.

    Thank you. :)

  • Profile Image

    Answered by thespanishfactory on September 10, 2013 at 10:22 PM

    Hi, thank you so much for your reply.

    The video that you send me shows how one of the forms in that page does not work "payment point" as there are some conditions in that form that did not work in tha example.

    But this post is about the blinding of all the form with conditions. Every time you open the page the form blink, showing all the hide fields and then closing them. It is a really bad user experience.

    This happend with all the browser i used.

    Just reload the page and you will se they blinking. 

  • Profile Image

    Answered by thespanishfactory on September 10, 2013 at 10:36 PM
  • Profile Image

    Answered by khrisell on September 10, 2013 at 10:39 PM

    Hello,

    I am really sorry for the error on the page as this is caused by my browser cache while investigating your form.

    I have cleared my form caches and I can see that it is working properly.

    With regards to your blinking problem.

    I have tried all of my browser and it is perfectly working.

    Have you cleared your browser caches already?

     

    Also, try to embed using iFrame.

    To get the iframe code, please follow these steps:

    1. Go to Setup & Embed

    2. Click Embed Form

    3. Click iFrame

     

    Copy the iFrame code and use that to embed the form to your site.

     

    3. Select iFrame

     

    Once you have copied the form, use that code to embed your form within your website/page.

    Kindly let us know if problem persists so that we could further investigate.

    Thank you.

  • Profile Image
    JotForm Support

    Answered by EltonCris on September 10, 2013 at 10:51 PM

    @thespanishfactory

    In addition to my colleague, I found two possible conflicts that causes this issue.

    1. Embedding multiple forms on the same page using script embed codes would cause conflict. It is advisable to use iframe to at least two of your forms if you have 3 forms on the page, e.g. one script embed code and two iframes. This prevents any possible issues.

    2. Jotform forms runs with prototype, this conflicts the jQuery script in your page. It would be best if you could try the source code embedding on your payment form. If the issue still persist, use noConflict to avoid both scripts from clashing. Avoiding Conflicts with Other Libraries | jQuery Learning Center

    Let us know if you require further assistance. Thanks.

  • Profile Image

    Answered by thespanishfactory on September 10, 2013 at 10:54 PM

    Thank you for your reply. I do not want to use iframe as i want to have a cozy page. If I would use iframes for that form, then it takes more than 2500px of height. Also, with iframe does not work the fields conditions properly. I already have a post open about that.

    I have clear evererything but i do not thing that is the problem because this hapen in all the computers i tried. This blinking is really very poor user experience.

    I really neeed to fix this. 

  • Profile Image

    Answered by thespanishfactory on September 10, 2013 at 11:25 PM

    Hi EltonCris

    The thing is that is you use the url of the form http://form.jotformpro.com/form/32526006627955 or http://form.jotformpro.com/form/32392658290965 there is not conflit at all. I just want this work like this in my page. I have tried all what you have said but i have not idea about the Comflict with Jquery.

    I would really apreciate if you could help me to fix this for good. 

  • Profile Image
    JotForm Support

    Answered by EltonCris on September 10, 2013 at 11:46 PM

    @thespanishfactory

    Stand alone forms do not have any conflicts. Conflicts only happens when the form is embedding to a page.

    Have you tried re-embedding your form using source code? This seems help fixed it. Kindly try and observed if there's any difference. How to get your Form Source Code. Sometimes, hosting the script may also reduces lags to avoid slowness on form loading.

    Please update us with the result. Thanks!

  • Profile Image

    Answered by thespanishfactory on September 10, 2013 at 11:51 PM

    Exactly, this it. It has to be a conflict with my page and i would like to fix it for good.

    Yes, the source code is on my server but i do not know how to embed it in my page This is the url, http://www.thespanishfactory.co.uk/pricing/form-payment.html 

    I dont want to use iframe as i said before i need a page cozy and small and with iframes this is not possible. The forms have conditions and they are geting bigger depending of the options.

  • Profile Image
    JotForm Support

    Answered by EltonCris on September 11, 2013 at 02:09 AM

    @thespanishfactory 

    Paste the source code in your page directly.

    1. Look for the codes between <title>Form</title> and the ending </head> tag of the form here: http://www.thespanishfactory.co.uk/pricing/form-payment.html. Copy and paste it between the <head> tag of your page.

    2. Next is to copy the html form, just copy the codes between the <body> and it's ending </body> tag and paste it anywhere on your page.

    --

    By the way, I would recommend to try the embedding as source code first not the entire files. Here's what I mean.

    Hope this helps. Thank you for your cooperation by the way, we greatly appreciate it.

  • Profile Image

    Answered by thespanishfactory on September 11, 2013 at 03:52 PM

    Hi, @EltonCris

    I tried to embed all the code as you showed me but it did not work, the form then opens all the hidden fields.

    But the topic of this is about why all my forms are blinking all the time when the the page is upload. https://dl.dropboxusercontent.com/u/89444410/2013-09-11_0330.swf

    This happens with all the forms i have on the page and honestly I would like to know the origin of the problem in order to fix it.

    It is obvious that there is a kind of conflict with the forms code and my page.

  • Profile Image
    JotForm Support

    Answered by jonathan on September 11, 2013 at 04:42 PM

    @  thespanishfactory

    Hi, the lag issue of the form when initially loading is maybe caused by 2 factor. 

    1. There is a large Show/Hide condition setup on the form. This most prevalent when the Show/Hide conditions invloves loading of several other forms within a form.

     I can see that this is a multiple payment form http://www.thespanishfactory.co.uk/pricing/form-payment.html

    2. If the internet/network of the user (including browser) have issue, there is high possiblity of lag in rendering the different forms inside the main form.

    BUT I would like to inform you that I did not encounter this when I test it on my end. This web page http://www.thespanishfactory.co.uk/pricing/student-centre.html  loads and render on my browser as if it doesn't even have any Show/Hide condition.(I meant it was loading flawlessly)

    Our colleague EltonCris had suggested using the form's source code embed, I agree with that also. I think that would be the better optimize embed you can use on this case.

     

    I tried to embed all the code as you showed me but it did not work, the form then opens all the hidden fields.

    Can you please tell us where you did this that is not working? I was able to checked this http://www.thespanishfactory.co.uk/pricing/form-payment.html but seems to be working.

     

    Thanks.

  • Profile Image

    Answered by thespanishfactory on September 11, 2013 at 05:37 PM

    Hi, thanks you for your reply.

    I have embeded the form as EltonCris advised me: www.thespanishfactory.co.uk/pricing/student-centre-test.html (see source) and the form does not work as i said.

     

    I tried the two ways he says:

    1. Look for the codes between <title>Form</title> and the ending </head> tag of the form here: http://www.thespanishfactory.co.uk/pricing/form-payment.html. Copy and paste it between the <head> tag of your page.

    2. Next is to copy the html form, just copy the codes between the <body> and it's ending </body> tag and paste it anywhere on your page.

    --

    By the way, I would recommend to try the embedding as source code first not the entire files.


    Also i tried this before i posted this issue. I have tried all the ways. This is an important form and this is why i am so worried.

    The blinks happen with a really short forms too: http://thespanishfactory.co.uk/pricing/best-offer.html  I have tried in 3 computers, 3 browsers and 2 diferent connections with the same result.

    I know you guys try your best. I just want this fix it for good. 

  • Profile Image

    Answered by Cesar on September 11, 2013 at 07:02 PM

    I've gone ahead and embedded your form http://support.jotform.com/form/32392658290965 as <Script> and have also tried utilizing the </iframe> method on a stripped down blank html. The behavior only happens on <Script> embedding. Which leads me to believe that this is how <Script> embedding process the code by default.

    http://screencast.com/t/h4lDMhbV4k

    I will continue looking into this, if I find any additional information I'll post it here.

  • Profile Image

    Answered by thespanishfactory on September 11, 2013 at 07:38 PM

    Hi Cesar, thank you for the help. But i cant use iframe for the forms because i want my page as cozy as it is. Also, with iframes i have others problems which have been already posted. Using that trick with diferent FREE HTML for multiples payments gateways is a really mess to be honest.

    https://dl.dropboxusercontent.com/u/89444410/2013-09-12_0029.png I want the page like this.


    If you can tell me how using iframe i could make the confitional forms as "dinamic & responsive" as they are using the embed way, i will be gratefull the rest of my life :)

  • Profile Image

    Answered by Cesar on September 11, 2013 at 10:18 PM

    I've kept on researching the issue as we need to isolate if the jQuery libraries are having conflicts on your page, at this time I will continue trying to do more tests with your code, We will keep you posted if any updates arise. Thank you.

  • Profile Image

    Answered by Cesar on September 12, 2013 at 12:27 AM

    I see that you did try the source code on your site, and the end result was that all hidden fields did show, in which case you would need to use the NoConflict function, 

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

    which should go under the last jQuery reference.

    Kindly try that out, either on that page or a copy of it, so we can see how you have your code distributed on your site. Thank you.

  • Profile Image

    Answered by thespanishfactory on September 12, 2013 at 12:45 AM

    Hi, do not know what you mean with

    "which should go under the last jQuery reference"

    You mean here:

    <!-- ============================================

            External JavaScripts

        ============================================= -->

    <script type="text/javascript" src="../js/jquery.js"></script>

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

    <script type="text/javascript" src="../js/plugins.js"></script>

     

     

     

  • Profile Image
    JotForm Support

    Answered by EltonCris on September 12, 2013 at 02:08 AM

    @ thespanishfactory

    It's not necessary, I believed it was not a conflict with your page. Why? It is happening because you have 5 different forms embedded in a single form. Since you are embedding these forms as script, it take sometime to render in the browser that's why it causes a little delay. Unfortunately I'm not sure if there's any possible solution to this other than using iframe. Also, as I've mentioned previously, since you are embedding the scripts from form to form, it would cause conflicts (probably due to multiple prototype scripts) between the forms even if they are not embedded in your site. I think you have to consider that behavior for now as its nature on script embedding until we found way to it if there's any, no guarantee yet.

    Thanks!

  • Profile Image

    Answered by thespanishfactory on September 12, 2013 at 08:53 AM

    Hi EltonCris

    I think you are not right. See this video https://dl.dropboxusercontent.com/u/89444410/2013-09-12_0043.swf

    http://thespanishfactory.co.uk/pricing/best-offer.html

    This form is quite basic and still have that delay. In tyhis page there is only 1 script embeded.

    1. I have tried with iframe and doest not work, because the conditionals were a mess.

    2. I tried to embed the full code.

    3. I tried to use the source code on my server.


    There is a conflict with my forms I want to fix as they do not work as they have to.

    Now, we were trying to  resolve this looking for the jquery conflict and I would like to follow this way if you do not mind as it is importar to me and to my business.

    I repeat again, the same delay and randon behivour happens with all the forms. 

  • Profile Image
    JotForm Support

    Answered by KadeJM on September 12, 2013 at 11:57 AM

    I was actually able to replicate this delay in Chrome so it is very understandable as to what you mean. It is also notable that you actually have 2 Forms on this page although 1 is in the Footer and the other is using Live Conditions. I could also see that after testing it some more an iFrame did not help since this too showed the same delay upon " Page Loading " or when refreshed.

    My guess is that this loading takes roughly 5-10 seconds at least. You have a fairly simple form so this should normally load very fast. It seems to me that what is really possibly causing this is the Conditions themselves since the other form does not have any. Also, when it's first viewed then they show at first beforehand instead of being hidden correctly as within the form conditions that have been configured.

    Additionally I don't really think it is the Forms with the problem. I am convinced it is something on your website somewhere. If it was the forms then we would be able to replicate this same issue even on the standalone but it doesn't happen. It only happens when embedded on your website. On a third test involving it where this time around I had the form as a standalone embedded on the page. In a fourth test I found that I was able to replicate this yet again via the source code for your website. So I think at this point is a matter of finding where the physical conflict is and correcting it.

    I did some deeper investigations testing with and without the JS using the Scripts on your website through the source code and I think I can confirm that using two iFrames does fix this which my colleague had mentioned earlier but I know you said you prefer to try to go the jQuery Route. So at the moment I'm not sure yet on how to fix it that way just yet but we will try to see what else there is that we can do in regards to this problem. I will also open up a Ticket about this with this information to see if there's anything further that we can do. It may take some time so as soon as we know something more if there's another way around it we will let you know.

  • Profile Image

    Answered by thespanishfactory on September 12, 2013 at 04:37 PM

    Hi Kade,

    I really apreciate your reply and all you time helpig me.

    Not is that i just do not want use iframes. I tried iframes and did not work neither.

    It it would be a way to to use iframe in a responsive web, resize the height automaticatly, i could try this but i have not idea if that it is possible, and it so, how to do it. 

    It would be of interest to know why this is happening as the same issues happened to me on the past, in my last page, with were a totally diferent theme.

  • Profile Image
    JotForm Support

    Answered by Mike_T on September 12, 2013 at 05:39 PM

    The ticket is up, so we will try to check this with developers.

    You can also try to use refined form source code on some test page to see if this is working for you. It can help with the blinking conditional fields.

    We will let you know once we have any updates from our Development Team.

  • Profile Image

    Answered by thespanishfactory on September 13, 2013 at 01:17 PM

    Thank you. I really apreciate your help.

    Waiting for your updates

  • Profile Image

    Answered by thespanishfactory on September 18, 2013 at 05:40 AM

    Hi there.

     

    any update about my probolem?

     

    Thank you

  • Profile Image
    JotForm Support

    Answered by guilledutra on September 18, 2013 at 08:36 AM

    Hi,

    The support ticket still opened and flagged as "Important", as soon as we get news ,we will let you know.

    Thanks for your patience again

  • Profile Image

    Answered by thespanishfactory on October 05, 2013 at 10:29 AM

    There is someone really looking at this bug? I am waiting almost 1 month.

    It is really important to fix this as i trust in JotForm services to run my business and those are the key forms for the payments.

    Please

    Thank you

  • Profile Image

    Answered by jedcadorna on October 05, 2013 at 01:30 PM

    Unfortunately we haven't receive an update yet but this hasn't been abandoned. Our developer will update you via this thread once this bug is fix. We apologize for the delay.

    Thanks,

  • Profile Image

    Answered by thespanishfactory on October 23, 2013 at 04:30 PM

    It is really somebody look into this?

    I am waiting for more than one month and half.

    Please 

  • Profile Image
    JotForm Support

    Answered by Mike_T on October 23, 2013 at 05:29 PM

    I can confirm that the ticket is still assigned to one of our developers, but unfortunately, we do not have any updates as of this moment. I think that the issue might be hard to fix, since the web front end is powered by Javascript, and this is not a perfect technology, so we are asking for some patience. We are sorry for the delay.

  • Profile Image

    Answered by thespanishfactory on November 12, 2013 at 06:39 AM

    2 months since I wrote this post asking for HELP for my KEY payment form and I am still waiting.

    PLEASE! can somebody help me? 

  • Profile Image
    JotForm Support

    Answered by ashwin_d on November 12, 2013 at 08:13 AM

    Hello thespanishfactory,

    I'm sorry for the trouble caused to you.

    Upon checking the ticket status, I would like to assure you that one of our key developer is already looking into this issue but unfortunately we have not received any update yet.

    We will get back to you as soon as we have any update from our backend team.

    Thank you for your patience.

  • Profile Image

    Answered by thespanishfactory on December 02, 2013 at 03:54 AM

    Any new? Almost 3 months now

  • Profile Image
    JotForm Support

    Answered by jonathan on December 02, 2013 at 06:03 AM

    Hi,

    I am sorry if there is no latest update on this yet. It still is an open ticket and still with our developers.

    I made a follow-up on this also just now, hopefully, they will post update on this thread the sonnest time available.

    Thanks.