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

    Passing data from one form to another with iFrame

    Asked by kauseway on December 08, 2014 at 10:28 AM

    I am trying to pass data. If I use just the forms URL it works fine.  But it does not work on my website.  I have installed the form using Iframe (based on your previous recommendation to make it mobile friendly). Do I need to use another format or what could be causing this:

     

    https://naturalcarecleaningservice.com/book-now-checkout/?email=mememe.com&beds=30&baths=54&freq=.35&postal=77077&sqft=3233

     

    http://form.jotformpro.com/form/43411187707959?email=mememe.com&beds=30&baths=54&freq=.35&postal=77077&sqft=3233

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

    one form Mobile format does not work email
  • Profile Image

    Answered by Carina on December 08, 2014 at 11:30 AM

    I tested the form 43411187707959  and it is not passing data to a 2nd form. To achieve this result, while using an iFrame you can use the workaround mentioned on this thread. You can also check our guide for more details on this process.

    Let us know if we can assist you further.

     

  • Profile Image

    Answered by kauseway on December 08, 2014 at 12:12 PM

    I would say that it IS passing the data and I had it working previously.  The second form is not taking it for some reason.  When I manual put the data in the URL the form on its own works fine. But when I put the   https://naturalcarecleaningservice.com/book-now-checkout/?email=mememe.com&beds=30&baths=54&freq=.35&postal=77077&sqft=3233 the second form is not taking it.

     

    I clicked on the link and it redirected me to my main jot form page. I dont think it works.

  • Profile Image

    Answered by kauseway on December 08, 2014 at 12:14 PM

    Also, using PHP seem like it is getting way to advance and I would need help with that.  CAn I ask what is causing the form to not take the data in the URL?  If we can fix that, as it did work before in another form, that would be the easiest.  I was wondering it if matters how the form is installed in the website?

     

  • Profile Image

    Answered by Carina on December 08, 2014 at 01:43 PM

    Just to make sure do you wish the form to be pre-populated with some values? This is different from one form passing values to a 2nd form. If you wish to pre-populate your form you can use the populate fields app and then pasting the resulting url in your iFrame code.

    If you wish instead to duplicate a field entry (so that your user does not have to type twice the same information in the same form) you can try the workaround stated in this thread.

    Please let us know more details of what you are trying to achieve so we can be of more assistance.

    Thank you

     

  • Profile Image

    Answered by Carina on December 08, 2014 at 01:48 PM

    By the way the iFrame code with prepoluated fields would be something like this:

     

    <iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="http://form.jotformpro.com/form/43411187707959?email=mememe.com&beds=30&baths=54&freq=.35&postal=77077&sqft=3233" frameborder="0" style="width:100%; height:487px; 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

    Answered by kauseway on December 08, 2014 at 02:01 PM
    Sorry. I don't want to prepopulate. I have to use I frame so it displays correctly. Bit now I can't pass data from
    My first form into my second form. Any work around besides hiring a php programmer.
    Sent from mobile device
    ...
  • Profile Image

    Answered by Carina on December 08, 2014 at 03:20 PM

    Thanks for clarifying but this is a prepopulated url, because this url will only fill in the fields with email=mememe.com and not according to user's previous choices:

    http://form.jotformpro.com/form/43411187707959?email=mememe.com&beds=30&baths=54&freq=.35&postal=77077&sqft=3233

    The url to pass values from one form to another (according to user's choices) would look something like:

    http://form.jotformpro.com/form/43114798262963?name=<?echo $name;?>

    This url requires a php page to work. We can assist you with this process but it is necessary that you provide us more details so that we can find the best solution. 

    As stated before if all you want is to duplicate the answers inside the same form we can easily achieve that with Form Calculation fields. 

    Let us know how we can assist you further.

  • Profile Image

    Answered by kauseway on December 08, 2014 at 03:32 PM

    Sorry for the confusion!  I got that URL from the first form when it passed it over. Again, worked fine when the second form was a script but I have to insert the second form as an ifram.e

     

    So yes if you could help!  I need to pass these fields:

    https://naturalcarecleaningservice.com/book-now 

    Into this form which has been inserted as an iframe on my site:

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

     

    Can you assist me with this process? Thanks!

     

     

     

  • Profile Image

    Answered by Carina on December 08, 2014 at 04:50 PM

    I will work deeper on this process and will get back to you latter with more information.

    If you need further support please let us know.

  • Profile Image

    Answered by kauseway on December 10, 2014 at 11:36 AM

    Having someone help me with this. Does hiding a form field affect the ability to pass information with php into an I frame?  

  • Profile Image

    Answered by Ben on December 10, 2014 at 02:22 PM

    Hi,

    I went to this page: https://naturalcarecleaningservice.com/book-now-checkout/ both with parameters and without them and I see that the js embedded jotform is there, not the iframe.

    Now with js embed, it is important to note that it should capture the URL parameters itself and place them in the jotform. The iframe however needs to have these details passed in its SRC property.

    Now, my colleague is correct about using POST to send from one jotform to another directly and has given a really good link on how to do this, but since you are using the iframe embedded on your page and have set the URL to pass parameters (?email=mememe.com&beds=30&baths=54&freq=.35&postal=77077&sqft=3233), you can use GET data instead of POST.

    Please copy this to your pages:

    <?php
       if(isset($_GET['email'], $_GET['beds'], $_GET['baths'], $_GET['freq'], $_GET['postal'],$_GET['sqft']))
       {
          $email = $_GET['email'];
          $beds = $_GET['beds'];
          $baths = $_GET['baths'];
          $freq = $_GET['freq'];
          $postal = $_GET['postal'];
          $sqft = $_GET['sqft'];

          /*
             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 = '?email=' . $email . '&' . 'beds=' . $beds . '&' . 'baths=' . $baths . '&' . 'freq=' . $freq . '&' . 'postal=' . $postal . '&' . 'sqft=' . $sqft;
       }
       else { $params = ''; }
    ?>
     
       <iframe id="JotFormIFrame" allowtransparency="true" src="//form.jotformpro.com/form/43411187707959<?php echo $params; ?>" frameborder="0" style="width:100%; height:487px; border:none;" scrolling="no"></iframe>

    This should work now.Do test and let us know how it goes for you.Best Regards,
    Ben

  • Profile Image

    Answered by kauseway on December 10, 2014 at 06:24 PM

    Thanks. I am not familiar with php.  I copied the entire thing and put it in my wordpress section in this sample page:

     

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

     

    The result was the php code was converted to text.  Where is the php code supposed to go so it works?

     

  • Profile Image
    JotForm Support

    Answered by jonathan on December 10, 2014 at 07:47 PM

    Hi,

    I also suggest reviewing this user guide

    -Send-POST-Data-From-JotForm-Using-PHP-in-Custom-Thank-You-Page

    It will help to better understand how to Send Post Data using PHP and Jotform.

    As for those PHP codes provided by our colleague Ben, you need to put them in the source code of your WP page.

    You need to actually open the .PHP page in WP so that you can add/insert the mentioned PHP codes.

    You will probably need help from a person with know hows to do it and can do it on your website, since this will require a bit of knowledge in programming in PHP and WP page.

    Hope this help. Inform us if you need further assistance.

    Thanks.