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

    Is there a way to locate the popup form widget anywhere I want? - RESOLVED!

    Asked by AA_C on February 22, 2016 at 12:24 PM

    If I want a popup form widget to appear screen center, can I change the css script to do this?

    TNX, Robert

    locate a
  • Profile Image
    JotForm Support

    Answered by Nik_C on February 22, 2016 at 02:05 PM

    Hello there,

    Try to put this inside of your html code:

    <script>

    function PopupCenter(pageURL, title,w,h) {

    var left = (screen.width/2)-(w/2);

    var top = (screen.height/2)-(h/2);

    var targetWin = window.open (pageURL, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);

    </script>

    <body>

    <a onclick="PopupCenter('https://form.jotform.com/60***83206****', 'Helpdesk',700,500);" target="_blank" href="javascript:void(0);">Test</a>

    </body>

    It will pup up in center of the screen, it required that function to center it. Just make sure that you change the URL and the name of the link that you would like (bolded).

    Please let me know if that worked for you.

    Best regards.

  • Profile Image

    Answered by AA_C on February 22, 2016 at 05:39 PM

    OK ... I neglected to let you know this will be used in a php page.

    and is related to a previous thread;

    Unique email popup form.

    See next posting.

    Robert

  • Profile Image

    Answered by AA_C on February 22, 2016 at 06:21 PM

    This script not working

    <script>

    function PopupCenter(pageURL, title,w,h) {

    var left = (screen.width/2)-(w/2);

    var top = (screen.height/2)-(h/2);

    var targetWin = window.open (pageURL, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);

    </script>

    <?php

     echo "<td style='width: 130px; height: 18pt;border-top:1px #ccc dotted;text-align:center'><a class='redLink9' onclick=\"PopupCenter('https://form.jotform.com/60487350939970?email=".$email." &judgesName=".$jname."','blank','scrollbars=yes, toolbar=no, width=700, height=1030' target="_blank" href=\"javascript:void(0);\") \">Contact</a></td>";

    ?>

    This is the working script now that I want to change:

    <?php

    echo "<td style='width: 130px; height: 18pt;border-top:1px #ccc dotted;text-align:center'><a class='redLink9' target="_blank" href=\"javascript:void( window.open( 'https://form.jotform.com/60487350939970?email=".$email." &judgesName=".$jname."', 'blank', 'scrollbars=yes, toolbar=no, width=700, height=1030' ) ) \">Contact</a>";

    ?>

  • Profile Image
    JotForm Support

    Answered by Chriistian on February 23, 2016 at 02:21 AM

    I tested your code on jsfiddle and I can see that the popup works, however, the popup window does not open in the center of the page.

     

    Allow me some time to make some tests to make the popup window appear in the center. I will inform you on this thread once I have a workaround. Regards.

  • Profile Image
    JotForm Support

    Answered by Chriistian on February 23, 2016 at 03:01 AM

    I was able to make the form appear in the center. Here's the link to the fiddle so you can see it in action: https://jsfiddle.net/jdee/epteL1f9/ 

    Simply copy the code below:

    <script>

    function popupCenter(url, title, w, h) {

    var left = (screen.width/2)-(w/2);

    var top = (screen.height/2)-(h/2);

    return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);

    </script>

    <?php

    echo "<td style='width: 130px; height: 18pt;border-top:1px #ccc dotted;text-align:center'><a class='redLink9' target="_blank" href=\"javascript:void( window.open( 'https://form.jotform.com/60487350939970?email=".$email." &judgesName=".$jname."','popup',500,500 ) ) \">Contact</a>";

    ?>

  • Profile Image

    Answered by AA_C on February 23, 2016 at 09:01 AM

    Hi,

    Thanks,

    I tried the code and had this error on line with new code;


    Parse error: syntax error, unexpected T_STRING, expecting ',' or ';' in /magma/users/u75/vws30554/public_html/com/judges/j_array.php on line 105

    Must be some minor thing,I will try and trouble shoot it.

    Thank you, Robert

  • Profile Image

    Answered by AA_C on February 23, 2016 at 10:36 AM

    GREAT.... WORKS NOW! Only issue was how wide the screen is.

    So I changed this to, width: popup',500,200 and voila it is perfect now .

    Thank you very much.

    Robert

  • Profile Image

    Answered by AA_C on February 23, 2016 at 10:44 AM

    Oops! spoke to soon. popup',500,200 Had no effect on window width.

    It is almost twice as wide as it needs to be. How do I get the window to form width with a bit of padding?

    Robert

  • Profile Image
    JotForm Support

    Answered by Kevin_G on February 23, 2016 at 01:00 PM

    I could not get it working, I will ask to my colleagues for some help here.

    I would like to share you these links that I found related to this:

    http://stackoverflow.com/questions/14344248/how-to-change-a-popup-windows-location

    http://stackoverflow.com/questions/4068373/center-a-popup-window-on-screen

    They might help.

     

  • Profile Image

    Answered by AA_C on February 23, 2016 at 01:16 PM

    @Kevin

    Appreciate the help. I was also looking for some solutions that showed how to set the width and there none that I have found so far. I had a look at the code on the links and I am reluctant to keep experimenting right now. 

    I will wait for your response, it is no big deal so no rush. I'm am using the original script right now.

    Thanks, Robert 

  • Profile Image
    JotForm Support

    Answered by Kevin_G on February 23, 2016 at 02:57 PM

    Yes, on the link that I shared above I found this code:

    <script type="text/javascript">

    function newPopup(url, windowName) {

        window.open(url,windowName,'height=200,width=200,left=10,top=10,titlebar=no,toolbar=no,menubar=no,location=no,directories=no,status=no');

    }

    </script>

    <a target="_blank" href="JavaScript:newPopup('lobby.do', 'lobby');">Enter Lobby</a>

    I have replaced the width and height properties and it worked on my end.

    Now I changed it yo apply it to your PHP code, just copy and paste it in your website and it should work: http://pastiebin.com/56ccb9388aee0

    Do let us know how it goes.

  • Profile Image

    Answered by AA_C on February 23, 2016 at 03:47 PM

    Hi Kevin,

    I tried the script and get NO popup.

    function newPopup(url, windowName) {    window.open(url,windowName,'height=500,width=500,left=200,top=10,titlebar=no,toolbar=no,menubar=no,location=no,directories=no,status=no');}

    <a class='redLink9' target="_blank" href=\"JavaScript:newPopup('https://form.jotform.com/60487350939970?email=".$email." &judgesName=".$jname."','Contact Form') \">Contact</a></td>";

     

  • Profile Image
    JotForm Support

    Answered by Chriistian on February 23, 2016 at 09:21 PM

    This code should make your popup window appear at the center and fix the height and width.

    <a  class='redLink9'   target="_blank" href="javascript:void(window.open( 'https://form.jotform.com/60487350939970?email=".$email." &judgesName=".$jname."','PopUp','width=500,height=500,top=50,left=400')) ">Contact</a>

    You can change the value of the yellow highlighted numbers to change the height and width, then you can change the value of the orange highlighted numbers to set its position in the screen. Hope this helps.

    jsfiddle: https://jsfiddle.net/jdee/epteL1f9/6/ 

     

     

     

  • Profile Image

    Answered by AA_C on February 24, 2016 at 07:35 AM

    That did the trick, works perfectly.

    Thank you every one at JotForm. Case closed!

    Final php script line for those interested: 

    echo "<td style='width: 130px; height: 18pt;border-top:1px #ccc dotted;text-align:center'><a class='redLink9' target="_blank" href=\"javascript:void( window.open( 'https://form.jotform.com/60487350939970?email=". $email ." &judgesName=". $jname ."','Popup','width=700,height=900, top=50,left=400')) \">Contact</a></td>";

    Best regards,

     

    Robert

  • Profile Image
    JotForm Support

    Answered by Kiran on February 24, 2016 at 11:26 AM

    Great!! Glad to see that the issue is now resolved for you and thank you for providing the updated scripts that might help others. Please do not hesitate to get in touch with us if you need any further assistance. We will be happy to help. 

    Thank you for using JotForm!! 

  • Profile Image
    JotForm Support

    Answered by Kiran on February 24, 2016 at 11:26 AM

    Great!! Glad to see that the issue is now resolved for you and thank you for providing the updated scripts that might help others. Please do not hesitate to get in touch with us if you need any further assistance. We will be happy to help. 

    Thank you for using JotForm!! 

  • Profile Image
    JotForm Support

    Answered by Kiran on February 24, 2016 at 11:26 AM

    Great!! Glad to see that the issue is now resolved for you and thank you for providing the updated scripts that might help others. Please do not hesitate to get in touch with us if you need any further assistance. We will be happy to help. 

    Thank you for using JotForm!! 

  • Profile Image

    Answered by AA_C on February 24, 2016 at 12:20 PM

    @Kiran... Now that's enthusiasm, Three Responses.. Thank you!