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

  • AA_C
    Asked 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

  • Nik_C
    Replied on February 22, 2016 at 2: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 onDISABLEDclick="PopupCenter('https://form.jotform.com/60***83206****', 'Helpdesk',700,500);" href="javascriptDISABLED: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.

  • AA_C
    Replied on February 22, 2016 at 5: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

  • AA_C
    Replied on February 22, 2016 at 6: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' onDISABLEDclick=\"PopupCenter('https://form.jotform.com/60487350939970?email=".$email." &judgesName=".$jname."','blank','scrollbars=yes, toolbar=no, width=700, height=1030' href=\"javascriptDISABLED: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' href=\"javascriptDISABLED:void( window.open( 'https://form.jotform.com/60487350939970?email=".$email." &judgesName=".$jname."', 'blank', 'scrollbars=yes, toolbar=no, width=700, height=1030' ) ) \">Contact</a>";

    ?>

  • Chriistian Jotform Support
    Replied on February 23, 2016 at 2: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.

    Is there a way to locate the popup form widget anywhere I want? RESOLVED! Image 1 Screenshot 20

     

    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.

  • Chriistian Jotform Support
    Replied on February 23, 2016 at 3: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=\"javascriptDISABLED:void( window.open( 'https://form.jotform.com/60487350939970?email=".$email." &judgesName=".$jname."','popup',500,500 ) ) \">Contact</a>";

    ?>

    Is there a way to locate the popup form widget anywhere I want? RESOLVED! Image 1 Screenshot 20

  • AA_C
    Replied on February 23, 2016 at 9: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

    Is there a way to locate the popup form widget anywhere I want? RESOLVED! Image 1 Screenshot 20

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

    Thank you, Robert

  • AA_C
    Replied 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

  • AA_C
    Replied 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

  • Kevin Support Team Lead
    Replied on February 23, 2016 at 1: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.

     

  • AA_C
    Replied on February 23, 2016 at 1: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 

  • Kevin Support Team Lead
    Replied on February 23, 2016 at 2: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 href="javascriptDISABLED:newPopup('lobby.do', 'lobby');">Enter Lobby</a>

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

    Is there a way to locate the popup form widget anywhere I want? RESOLVED! Image 1 Screenshot 20

    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.

  • AA_C
    Replied on February 23, 2016 at 3: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=\"javascriptDISABLED:newPopup('https://form.jotform.com/60487350939970?email=".$email." &judgesName=".$jname."','Contact Form') \">Contact</a></td>";

     

  • Chriistian Jotform Support
    Replied on February 23, 2016 at 9: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="javascriptDISABLED: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/ 

    Is there a way to locate the popup form widget anywhere I want? RESOLVED! Image 1 Screenshot 20

     

     

     

  • AA_C
    Replied on February 24, 2016 at 7: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' href=\"javascriptDISABLED: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

  • Kiran Support Team Lead
    Replied 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!! 

  • Kiran Support Team Lead
    Replied 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!! 

  • Kiran Support Team Lead
    Replied 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!! 

  • AA_C
    Replied on February 24, 2016 at 12:20 PM

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