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

    How can I embed editable submitted form in Wordpress?

    Asked by tangibleinteraction on July 10, 2015 at 03:04 PM

    Hello,

    I am wondering if I can embed a form that has previous user inputs into a wordpress post. 

    Currently the link to the web form for test is: 

    http://submit.jotform.ca/form.php?formID=51877562998276&sid=312290491031832424&mode=edit

    I am wondering if this link can be embedded in wordpress in a similar way that a regular jotform form is embedded in wordpress.

    For example, the embed code for the above form without editing data is  

    <script type="text/javascript" src="//www.jotform.com//?formID=51877562998276"></script>

    But this code will not allow the user to continue edit his/her previously submitted form. Do you think there's any workaround for our needs?

    Thanks so much for attending to this issue.

     

    Best,

    Chao Feng

    Page URL:
    http://submit.jotform.ca/form.php?formID=51877562998276&amp;sid=312290<br/>491031832424&amp;mode=edit

    editable submitted form WordPress
  • Profile Image

    Answered by Ben on July 10, 2015 at 04:37 PM

    If you wish to have the form editable - always that one set of data shown on that specific page, then it would be easy to do so, by changing this:

    <script type="text/javascript" src="//www.jotform.com/form.php?formID=51877562998276"></script>

    to this:

    <script type="text/javascript" src="//submit.jotform.ca/form.php?formID=51877562998276&sid=312290491031832424&mode=edit"></script>

    As you can see the only thing that was changed was the src (source) attribute.

    Do however note that anyone going to the form over that link, will see those details and would be able to fill out those details as well.

    Do you wish to have the edit option, but in the same time to have it on your own website?

    If so that is possible to a certain extent, depending on how you want to accomplish it.

  • Profile Image

    Answered by chaofeng on July 14, 2015 at 02:33 PM

    Hi Ben,

    I've tried your embedding codes in wordpress:

    While

    <script type="text/javascript" src="//www.jotform.com/form.php?formID=51877562998276"></script>

    This line works properly, but the code below doesn't work:

    <script type="text/javascript" src="//submit.jotform.ca/form.php?formID=51877562998276&sid=312290491031832424&mode=edit"></script>

    The edited form will not show up in the wordpress post, which is ideally hosted on my own website.

    Do you wish to have the edit option, but in the same time to have it on your own website?

    Yes, I'm wondering how this can be implemented.

    Thanks for attending to the question!

     

     

  • Profile Image
    JotForm Support

    Answered by KadeJM on July 14, 2015 at 04:20 PM

    Do you have a website page already for this? If so may we see it if possible?

    Also are you intending to use it with wordpress.com or wordpress.org?

  • Profile Image

    Answered by chaofeng on July 14, 2015 at 05:16 PM

    Hi, Thanks for replying. And I've also got some updates. 

    Strangely enough, if I include both embedding codes in one wordpress post, the editable form can be displayed, and also shows the responses edited from last time. The embedding code I put in the wordpress post is as below:

     

    <script src="//form.jotform.ca/jsform/51877562998276" type="text/javascript"></script><script src="//submit.jotform.ca/form.php?formID=51877562998276&amp;sid=312715372881945946&amp;mode=edit" type="text/javascript"></script>

    Please note that I included both the embedding code for original form and that of the post-submission editable form. And if I embed the code below only:

    <script src="//submit.jotform.ca/form.php?formID=51877562998276&amp;sid=312715372881945946&amp;mode=edit" type="text/javascript"></script>

    The form just won't be displayed at all. I'm not sure if it's the way in which jotform is supposed to work. Any idea?

    Another issue is, I cannot see the preview of uploaded file from the embedded form on my wordpress web page. For examle, below is the link to my web form, as you'll see, there is a file name "sth.html" under the "choose file" button, as I uploaded a file named"sth.html" previously for testing purpose. But this preview cannot be displayed in the upload field on my wordpress form, although responses in all other fields are displayed correctly. Below is the link to the form:

    http://submit.jotform.ca/form.php?formID=51877562998276&sid=312715585881339007&mode=edit

     

    Btw, I use neither wordpress.com nor wordpress.org, and as far as I know plugins are not supported by wordpress.com. I am now hosting the wordpress site locally on my computer.

  • Profile Image
    JotForm Support

    Answered by EltonCris on July 14, 2015 at 08:44 PM

    @chaofeng

    Unfortunately, it is not possible to use script code on edit mode forms. I would suggest to use iframe code instead, it should work similarly as you are loading it on your browser. You can use the following code.

    <iframe src="//submit.jotform.ca/form.php?formID=51877562998276&sid=312290491031832424&mode=edit" width="100%" height="660" scrolling="no" style="border:none;"></iframe>

    We will answer your other question here http://www.jotform.com/answers/610262