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

    Button radio widget buttons cutoff after embedding the form

    Asked by kauseway on March 19, 2015 at 04:24 PM

    So all of a sudden my form is not displaying corrrectly?

     

    Looks fine on its own but on my website the second field "Inital Clean" button is not displaying

     

    https://naturalcarecleaningservice.com/book-now-checkout/

     

    http://form.jotformpro.com/form/50005155818954

     

    I have tried to clear the form cache and revert the form to this morning when it worked.  That didnt fix it.  The form on its own displays fine but does not on my website.

    Page URL:
    http://form.jotformpro.com/form/50005155818954

    form not displaying displaying correctly all href
  • Profile Image
    JotForm Support

    Answered by steve on March 19, 2015 at 08:41 PM

    Hello,

    I'm looking at your embed code on your form, and I'm not sure where it's from. Here's an example of the difference between the iFrame embed code I received, and the one you used.

    http://pastebin.com/PfUtji2N

    Please get a new version of the embed code and place it on the page again. Here's how:

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

    Please let us know if you have further questions. Thanks!

  • Profile Image

    Answered by kauseway on March 19, 2015 at 09:21 PM

    Well I think it is really broking now! Can you help. The page is displaying this error:

     

     

    Parse error: syntax error, unexpected 'JotFormIFrame' (T_STRING), expecting ',' or ';' in/home/content/p3nexnas06_data02/43/2160643/html/wp-content/plugins/allow-php-in-posts-and-pages/allowphp.php(373) : eval()'d code on line 22

     

     

     

    Here is the full source code I put in:

     

    if(isset($_REQUEST['email'], $_REQUEST['beds1'], $_REQUEST['baths2'], $_REQUEST['freq'], $_REQUEST['postal'],$_REQUEST['sqft'], $_REQUEST['address'], $_REQUEST['phone']))

       {

          $email = $_REQUEST['email'];

          $beds = $_REQUEST['beds1'];

          $baths = $_REQUEST['baths2'];

          $freq = $_REQUEST['freq'];

          $postal = $_REQUEST['postal'];

          $sqft = $_REQUEST['sqft'];

          $phone = $_REQUEST['phone'];

          $address = $_REQUEST['address'];

     

          /*

             Here you can now use the variables above for any extra / relevant use that you might need on your website besides passing the value to iframe

          */

     

          $params = '?a' . mt_rand(100,500) . '=' . mt_rand(10,5000) . '&email=' . $email . '&beds=' . $beds . '&baths=' . $baths . '&freq=' . $freq . '&postal=' . $postal . '&address=' . $address . '&phone=' . $phone .  '&sqft=' . $sqft;

       }

       else { $params = ''; }

       //echo "Params".$params;

     

     

       echo "<iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="https://secure.jotformpro.com/form/50005155818954" frameborder="0" style="width:100%; height:5857px; border:none;" scrolling="no"></iframe>

    <script type="text/javascript">window.handleIFrameMessage = function(e) {var args = e.data.split(":");var iframe = document.getElementById("JotFormIFrame");if (!iframe)return;switch (args[0]) {case "scrollIntoView":iframe.scrollIntoView();break;case "setHeight":iframe.style.height = args[1] + "px";break;case "collapseErrorPage":if (iframe.clientHeight > window.innerHeight) {iframe.style.height = window.innerHeight + "px";}break;case "reloadPage":window.location.reload();break;}};if (window.addEventListener) {window.addEventListener("message", handleIFrameMessage, false);} else if (window.attachEvent) {window.attachEvent("onmessage", handleIFrameMessage);}</script>

    ";

  • Profile Image
    JotForm Support

    Answered by steve on March 19, 2015 at 09:29 PM

    Hello,

    This looks like an issue with how the form is integrated into WordPress. We have specific instructions for that, here:

    http://www.jotform.com/help/4-Adding-Forms-to-Wordpress-org-version

    Can you please follow those, and if there are still issues please let us know. Thanks.

  • Profile Image

    Answered by kauseway on March 19, 2015 at 09:29 PM

    All I did was copy the iframe into the code you provided before above and I broke the whole thing.

     

    Also, The form displays correctly in preview mode. BUT if you click on embed, source code and preview that first field (initial form) is also cut off. And that is NOT on my website. So there must have been a change to that widget that is causing the problem and not my site I would think? Please look at the form under embed, source code, preview to see.

  • Profile Image

    Answered by kauseway on March 19, 2015 at 09:30 PM

    that doesnt help me. I got the specific code from you guys that made it all work fine. Now it is completely broken.  Plus I dont think that is the issue with that button.  Any help appreciated. That link does not help me.

     

  • Profile Image
    JotForm Support

    Answered by steve on March 19, 2015 at 09:40 PM

    > All I did was copy the iframe into the code you provided before above and I broke the whole thing.

    I think this is the issue. I used an iFrame code for a clone of your form, that I since deleted. So it's an embed code to nothing.

    Per my comment above. Please get a new version of the embed code and place it on the page again. Here's how:

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

    Actually, I just grabbed it for you here. However, please double check if you have an issue with it. I do apologize for the misunderstanding. I tested this on a separate site and it works on my end.

    http://pastebin.com/3Rn6HQzb

     

  • Profile Image

    Answered by kauseway on March 19, 2015 at 10:09 PM

    Ok I pasted that in there and it crashed the whole thing. I compared to two and the version you gave me has quotes " instead of single quote '. also it does not have the $params code which I assume is what is passing information from my first form to this second form. Below is the original iframe.

    <iframe id='JotFormIFrame' onload='window.parent.scrollTo(0,0)' allowtransparency='true' src='https://secure.jotformpro.com/form/50005155818954".$params."' frameborder='0' style='width:100%; height:4666px; border:none;' scrolling='no'></iframe>

    Just to be clear I go into Jotform and click embed, source and then preview and I see the same intial clean field cutoff! I think that means it is a jotform issue and not my webpage. The preview is showing me direct from jotform.  This is a speciatly button I am using. My guess is it is now broken. 

    Can you review this with the information I provided. Thanks

     

  • Profile Image

    Answered by kauseway on March 19, 2015 at 10:12 PM

    I just went into jotform directly and clicked duplicate that field. See what happened! The new field is cut off!  I think this is a jotform button issue.

     

  • Profile Image

    Answered by kauseway on March 19, 2015 at 10:16 PM

    I then clicked on the wizard icon and edited the spacing on the buttons to 5 and it fixed it self for the copied buttons directly on jotform preview.  I then deleted the button and recopied it and it showed up fine the second time in the edit screen.

  • Profile Image

    Answered by kauseway on March 19, 2015 at 10:22 PM

    Finally, if you go to embed, source and preview with it secured http is shows the button cutoff.  uncheck the ssl secure link and it views fine.  Hopefully that helps with correcting this issue.

  • Profile Image
    JotForm Support

    Answered by Kiran on March 20, 2015 at 04:04 AM

    As I check the cloned version of your JotForm, I see that the Button radio widget has been removed. If you are considering to add the widget, could you try changing the width and height of the widget from its properties. I was able to see that it is displaying correctly.

    Please let us know if you need any further assistance. We will be happy to help.

    Thanks!