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

    Developing a JotForm extension for MediaWiki (Wikipedia CMS)

    Asked by eiermann on June 11, 2015 at 11:56 PM

    Dear Jotform family,

    we are currently developing an extension for MediaWiki, the popular wiki CMS from Wikipedia. 

    I was wondering if you could help us to figure out why it is not working properly. 

    We currently have 2 main issues that needs to be solved:

    1. The next button doesn’t work

    2. The tabs doesn’t show up

    It would be awesome if you can help us to solve these two problems so we can publish it to be used for other wiki users. 


    Links:
    Jotform form

    Form used with extension (doesn’t show tabs / next buttons not working)

    Source Code

     

    Kind Regards,

    Chris

    Screenshot
    JotForm source publish next MediaWiki wikipedia wikipedia CMS extension embed wiki wiki embed
  • Profile Image
    JotForm Support

    Answered by Boris on June 12, 2015 at 03:44 AM

    Hello Chris.

    Very nice job on embedding JotForm forms into MediaWiki! :)

    I have looked at the page that you have provided, and the form shows up properly - I can see the tabs and the email field just fine.

    Your page appears working for me, both on Windows and Ubuntu, Firefox and Chrome. Can you please try again, after clearing your browser cache, to make sure you are loading your entire page correctly?

    Have you fixed the problem on your own?

    Does the problem manifest only when you are logged into your wiki site?

    Thank you. That is a very nice looking embed of the form onto a wiki.

  • Profile Image

    Answered by eiermann on June 12, 2015 at 04:11 AM

    Dear Boris, 

    thanks for your support. It is actually true that the form works perfectly fine as long as I am not logged in (the wiki). Any idea why is that? I informed the developer and will see if he can fix it. Thanks for the hint. I will post the link to the MediaWiki extension page once it is stable.

     

    Cheers,

    Chris

  • Profile Image
    JotForm Support

    Answered by Boris on June 12, 2015 at 04:41 AM

    It looks very likely to be a scripting conflict between the scripts that are presented to you when you are logged into your wiki site, and the scripts of the form. You can try using the iFrame embed codes inside your extension, instead of the current script embed method, to see if it helps circumvent the issue.

    I see that you are already using the JQuery noConflict mode, which is great, but other scripts might still be conflicting with form's scripts.

    return '<script type="text/javascript" src="//form.jotform.co/jsform/' . $formId . '?' . $queryString . '">jQuery.noConflict();</script>';

    Maybe if you've tried using the iFrame code here, but the big problem with using iFrame code in such a scripted manner is that you can't know in advance how high the iFrame that will contain the form should actually be, that is why the height is in red below.

    return '<iframe id="JotFormIFrame" onload="window.parent.scrollTo(0,0)" allowtransparency="true" src="//form.jotform.com/form/' . $formId . '" frameborder="0" style="width:100%; height:700px; border:none;" scrolling="auto"></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>';

    Another important problem with scripting your extension to jotform.co domain, is that we use many many servers and domains to distribute the load, such as jotform.com, jotformpro.com, jotformeu.com, etc. Forms may not be accessible on a different domain, only on the domain that is presented to the user in their Embed Codes.

    It seems that you have taken your demo page down, and it is no longer accessible. It might help if you created a temporary account for someone to just log in and check how the scripts differ when you are logged in, compared to logged out users.

    Please let us know how it goes.

  • Profile Image

    Answered by eiermann on June 13, 2015 at 01:30 AM

    Dear JotForm support, 

    I just created an account for you. Please let me know to who I should send the login details.

    This morning I did some more extensive testing. I tested the extension on Mac with Chrome, Safari, Firefox and Opera. I found out that it is actually irrelevant if I am logged in or logged out. Sometimes it works, sometimes it doesn't. For example if I am logged out it may work. If I refresh it may still work or stops working. If it doesn't work and I refresh it works most of the time (maybe not with the first refresh). So I guess the problem is that the form doesn't get fully loaded and therefore some functions don't work properly like the tabs, updating the total sum and validate entries. 

    I added some more text and pictures to the test page and it seems since then it is even more difficult to fully load the form. We use MaxCDN cache (content distribution network) and have implemented the so called delayed loading principle to load the pages faster and continue loading the rest in the background. Could this have some impact on the forms?

    Thanks for your help so far.

    Happy weekend,

    Chris

  • Profile Image
    JotForm Support

    Answered by Aury on June 13, 2015 at 03:59 PM

    Hello Chris,

    You may send any comments, requests or inquiries to support@jotform.com .

    If we can assit you further, please let us know through this forum.

    Thanks.

  • Profile Image

    Answered by Chris  on June 26, 2015 at 09:41 PM

    I just sent you an email to login. 

  • Profile Image
    JotForm Support

    Answered by BJoanna on June 27, 2015 at 03:29 AM

    I have searched and I did not find any email coming form your email address. Can you resend the mail and notify us here what is the subject of email or you can give us login credentials here. 

    Looking forward to your reply. 

  • Profile Image

    Answered by Chris on June 27, 2015 at 06:18 AM

    Hi! The user name is "JotForm". I can't recall the password but if you click "Forgot password" it will be sent to support@jotform.com. Since the website is a wiki you could also just create a new account on the top right ;)

  • Profile Image
    JotForm Support

    Answered by Aury on June 27, 2015 at 11:56 AM

    Thank you so much Chris, we will reset the password to get the access.

    Whenever  you have an inquiry, please feel free to contact us.

  • Profile Image

    Answered by eiermann on July 09, 2015 at 02:31 PM

    Dear JotForm support. We could really need your help with this one. Can you let us know your insights? What is preventing the form from fully loading? Did you already test while logged in and logged out? 

    Thanks for your help!

  • Profile Image

    Answered by Sammy on July 09, 2015 at 03:45 PM

    I have logged with my wiki account and the form is loading fully and the next buttons are working, I'm doing the test in Firefox and chrome so far the form extension is behaving correctly.

    Could you confirm if it is the same from you side.

  • Profile Image

    Answered by eiermann on July 10, 2015 at 03:52 PM

    Hi Sammy. Sometimes they do but most of time they don't fully load. Especially when the internet connection is not very fast the form will not fully load. The consequences are that the tabs are missing and the next buttons doesn't work. Try to refresh and try different browsers. I have the problem with all browsers I tried: Chrome, Firefox, Safari, Opera. Sometimes it works, sometimes it doesn't. 

  • Profile Image

    Answered by Ben on July 10, 2015 at 06:02 PM

    Hi Chris,

    The most likely thing is the conflict as mentioned by Boris above. This also explains why it works and why it does not.

    To put it like that, when the form seems to be working just fine (and there is a conflict) your conditions might not work, but everything else does, or your page breaks, etc might not work, and everything else does.

    This is because different conflicts can arouse when the "same code" is used.

    For example, it works just fine for me now.

    When I have refreshed I see a lot of warnings such as:

    Content Security Policy: Couldn't process unknown directive 'child-src'

    and error:

    SecurityError: The operation is insecure

    I see that it is related to the following call:

    http://studyinbali.balilink.netdna-cdn.com/load.php?debug=false&lang=en&modules=ext.CurrencyConverter%2Cbreadcrumbs2%2Cheadertabs%7Cjquery.async%2CcheckboxShiftClick%2Ccookie%2ChighlightText%2CmakeCollapsible%2Cmw-jump%2Cplaceholder%2Csuggestions%7Cmediawiki.action.view.postEdit%7Cmediawiki.api%2Ccldr%2Ccookie%2CjqueryMsg%2Clanguage%2CsearchSuggest%2Cuser%7Cmediawiki.language.data%2Cinit%7Cmediawiki.libs.pluralruleparser%7Cmediawiki.page.ready&skin=vector&version=20150710T215034Z&

    Now, javascript is great, but a big problem with it is that upon an error, it will break most likely stop executing things properly - depending on the issue.

    Form of course works.

    Now, I would like to suggest a further testing so can you please replace this code:

    <script src="//form.jotform.co/jsform/40271544377960?" type="text/javascript">jQuery.noConflict();</script>

    with this code:

    <iframe frameborder="0" scrolling="no" style="width: 100%; border: medium none; height: 497px;" id="40271544377960" name="40271544377960" allowtransparency="true" src="//form.jotform.co/form/40271544377960" onload="window.parent.scrollTo(0,0)"></iframe>

    Or to change the noConflict(); to be right above the script call, like so:

    <script type="text/javascript">jQuery.noConflict();</script>
    <script src="//form.jotform.co/jsform/40271544377960" type="text/javascript"></script>

    Do let us know how it goes.

  • Profile Image

    Answered by eiermann on July 11, 2015 at 04:52 AM

    Hi Ben,

    thanks for your support. I tried the noConflict script but even there the tabs don't load most of the time. Iframes work great but the problem with iframes is that they don't look good when the size of the form changes. Depending on the entries the form height changes. And then sometimes there is a lot of white space or scrolling bars appear. 

  • Profile Image

    Answered by Ben on July 11, 2015 at 06:50 AM

    Hi Chris, you are welcome. I am looking into the iframes to see if we can make them adjustable as needed, so I have create an account (It seems that "JotForm" account was not verified and as such it was seen as non exiting) so I made some changes to the page.

    I will leave the password for the account in the private area for my colleagues to see as well.

    Now I have tried to do few things but it seems that there are some issues where even Zopim starts to bug out.

    http://v2.zopim.com/?143HG5kfvOFPGFZrL4FxFzinL1BzmIB9

    At another time there were some issues just popping out, but as it went over 90 I was not able to see the log what is causing them (will need to adjust few things to see that much)

    Now due to some of these errors that I had mentioned earlier as well the following code:

     if (window.addEventListener)
      {
        window.addEventListener("message", handleIFrameMessage, false);
      }
      else if (window.attachEvent)
      {
        window.attachEvent("onmessage", handleIFrameMessage);
      }

    does not run when the page loads, and this code is important to have the iframe resize.

    Are you having the same issues on the form itself and on the page, or just when the form is on the page?