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

    Form expanded even though fields are hidden

    Asked by bendproweb on December 13, 2013 at 01:31 PM

    I am trying to use a form in a Wordpress sidebar.  I want to keep the height of the form short initially so I have a field hidden until the email address field is filled in (I also tryed using show when email is filled). The problem is that even though the field is hidden, the form stays the same height as it would be with the hidden fields visible.  I have tried using the Wordpress embed code, iframe code and the Jotform plugin.  They all do the same thing.  It does the same thing whether I put the code in a widget in the sidebar or in the main body of a page.

    I set up a test page I set up with the form in both the sidebar and body of the page.  Both forms have a large grey area at the bottom that fills in when the form expands.  I don't want that grey area there until the form expands.  They are both currently set up using iframe code.

    Thanks!

    Page URL:
    http://www.ceylonblu.com/form-test/

    hidden JotForm address field iframe code email problem
  • Profile Image
    JotForm Founder

    Answered by aytekin on December 13, 2013 at 03:58 PM

    One possible solution is to use the jotform iframe code. Then the form height cannot expand. It will stay static.

    http://www.jotform.com/help/148-Getting-the-Form-iFrame-Code

    Can you give that a try?

  • Profile Image

    Answered by bendproweb on December 13, 2013 at 04:03 PM

    I am using the iframe right now.  I don't want the frame static.  I want it to expand. I've tried with both iframe and the Wordpress embed codes.  I just updated the page so that the sidebar has the iframe and the page has the wordpress embed codes.  The height is still the full expanded height even though the large section of the form is still hidden.

  • Profile Image
    JotForm Support

    Answered by Mike_T on December 13, 2013 at 05:18 PM

    If you need a self expanding form you can try our standard Embed code, same as you use on the main entry section.

    It seems to be working everywhere except the Google Chrome browser. There is most probably some bug in Chrome that is not removing the additional height.

  • Profile Image

    Answered by bendproweb on December 13, 2013 at 06:14 PM

    Good call. I was using Chrome.  Tried in Firefox and using the standard embed code it works if the code is in the body.  The only way I can get the form to show up in the sidebar though is with the iframe code and when I do that the frame stays open.

  • Profile Image
    JotForm Support

    Answered by Welvin on December 14, 2013 at 02:04 AM

    The Javascript code is incorrect. You have it as:

    <script type='text/javascript' src='//form.jotform.us/jsform/?1641612167'></script>

    That is not the correct form embed codes. If you have the same form to the sidebar then the correct codes should be:

    <script type="text/javascript" src="//form.jotform.us/jsform/33465366660156"></script>

     

    Thanks

  • Profile Image

    Answered by bendproweb on December 14, 2013 at 10:32 AM

    Thanks. I updated the embed code and it is showing up again in the sidebar. Still expanded in Chrome/Opera but working in Firefox, Safari and IE.  Thanks.

  • Profile Image
    JotForm Support

    Answered by EltonCris on December 14, 2013 at 07:18 PM

    @bendproweb

    Your form appears on the sidebar because you've placed it on a text widget on your sidebar. If you'd like it to be on the main body content, you have to edit your form-test page under Pages, and place the form embed code there, or you can use short-code e.g. [jotform id="33465366660156"] provided by WP Plugin.

    We have a step by step instruction on how to embed form to Wordpress, please follow this guide: https://www.jotform.com/help/4-Adding-Forms-to-Wordpress

    We also have WP Plugin available where you can create a form directly on your WP Dashboard and embed it anywhere on your WP page. http://watchstreetconsulting.com/form-generator-wordpress

    Thanks!

  • Profile Image

    Answered by bendproweb on December 18, 2013 at 12:17 PM

    Actually I really want it in the sidebar. I was just trying to see if the form worked the same when placed on a page as it does in the sidebar.  

    Thanks for the links.  I'll check them out.

  • Profile Image
    JotForm Support

    Answered by Mike_T on December 18, 2013 at 04:35 PM

    You might also try a white form background, so that the height will not be noticeable on the end user side.

  • Profile Image

    Answered by bendproweb on December 18, 2013 at 04:37 PM

    Good point.  I thnk I'll do that.  Thanks.