Signature box not functioning on mobile

  • Profile Image
    sageparenting
    Asked on May 14, 2020 at 05:35 PM

    The signature box on my agreement form is not functioning on mobile, as reported by my clients and verified by me when I try to access it on my iPhone. See attached photo. The box isn't fully visible and you can't click or sign in it.1589492104IMG_9268.PNG

  • Profile Image
    Bert_A
    Answered on May 14, 2020 at 08:59 PM

    Hi there,

    Thank you for reaching out.

    I have checked your form on mobile device and I couldn't replicate the issue as the signature field works properly.



    Can you please try clearing your browser's cache or use an incognito browser and see if the issue would still occur?

  • Profile Image
    sageparenting
    Answered on May 17, 2020 at 03:28 PM
    I had 2 more clients try and both reported the box not working on mobile
    (they can't click or sign in the box).
    ...
  • Profile Image
    BDAVID
    Answered on May 17, 2020 at 05:22 PM

    Hi, I assume that it only happens when you try to fill it from your site rachelrainbolt.com, I just checked it, but I could not find the page where your form is embedded, could you please provide the exact URL of the web page?

  • Profile Image
    sageparenting
    Answered on May 17, 2020 at 06:28 PM
    Yes rachelrainbolt.com/agreement
    ...
  • Profile Image
    gerardw
    Answered on May 17, 2020 at 09:29 PM

    We apologize for this inconvenience. I am able to replicate the issue on my iPhone as well.

    The Signature fields appears cut and am unable to add my signature.

    Could you embed the form on your website using the iFrame code and then check - https://www.jotform.com/help/148-Getting-the-Form-iFrame-Code 

    I believe this should take care of the issue.

    Do test and let us know.

  • Profile Image
    sageparenting
    Answered on May 18, 2020 at 04:28 PM
    I embedded the iframe and it seems to be working now. Thank you.
    ...
  • Profile Image
    sageparenting
    Answered on May 31, 2020 at 04:28 PM
    I have a client who has tried to sign this same agreement form from
    multiple computers and on mobile and on every device she says she cannot
    access the signature box (on mobile) or submit the signature box (on
    computer - photo attached).
    ...
  • Profile Image
    Amin_N
    Answered on May 31, 2020 at 07:28 PM

    Hi again, @sageparenting!

    We are very glad to know that the issue has now been resolved using iFrame code. On behalf of the Jotform support team, you are most welcome.

    As per the one respondent who still can't add signature, we would like you to advise them to clear browser cache and give it another try.

    Also, kindly note that we haven't received your screenshot, as it seems that you've sent it via email, therefore I would like to advise that you alternatively reply to this support ticket instead. Here's a guide how you can do it.

    We're patiently waiting for your response.


  • Profile Image
    sageparenting
    Answered on May 31, 2020 at 08:24 PM

    I have a client who has tried to sign this same agreement form from multiple computers and on mobile and on every device she says she cannot access the signature box (on mobile) or submit the signature box (on computer - photo attached). 1590971035image.png

  • Profile Image
    gerardw
    Answered on May 31, 2020 at 10:03 PM

    Yes, I can see from your website link that the Submit button is not visible. Could you reduce the height of the iFrame and check:

    15909765030106_8.png

    This looks to be the issue since I was not able to view the Signature box or the fields at the bottom on an Android and an iPhone device.


  • Profile Image
    sageparenting
    Answered on May 31, 2020 at 10:28 PM
    How do I reduce the height of the iframe?
    ...
  • Profile Image
    sageparenting
    Answered on May 31, 2020 at 10:28 PM
    And what do I reduce it to? What I see on the backend of my website when I
    open the iframe is different than the screenshot you sent. See attached.
    ...
  • Profile Image
    gerardw
    Answered on June 01, 2020 at 01:58 AM

    Sorry for the confusion. Please try this approach.

    When you embed the form on your website, use the iFrame section of the code instead of the entire code:

    15909909990106_12.png

    Here is the code:

    <iframe id="JotFormIFrame-200577050904046" title="Coaching Agreement" onload="window.parent.scrollTo(0,0)" allowtransparency="true" allowfullscreen="true" allow="geolocation; microphone; camera" src="https://form.jotform.com/200577050904046" frameborder="0" style=" min-width: 100%; height:3500px; border:none;" scrolling="no" > </iframe> 

    Please try this code to embed on your website and check if it's visible on mobiles.

  • Profile Image
    sageparenting
    Answered on June 07, 2020 at 02:28 PM
    It worked for and then I had to edit something in the form and now the
    signature box is gone again on both desktop and mobile again! I tried
    extending the height all the way up to 8000 but that didn't help so I moved
    it back to the 3500 you originally recommended. Help!
    ...
  • Profile Image
    Welvin
    Answered on June 07, 2020 at 04:24 PM

    It did not work because the form is placed in a frame with a fixed height. See this:

    2020-06-08-019.png

    You should adjust both the iframe height of the form and the frame height of the container that currently holds the form.

    I also suggest setting up a default height based on the mobile. So, try 9000px instead of 8000px. 

    Note that the iframe embed codes have a script part that supposed to automatically adjust the height of the form. You previously did this, but it is creating a new problem, so I believe there is a conflict on the page. Would you mind duplicating the current page and embed the full iframe embed codes there? I'd like to troubleshoot the form that way.

    Also, the website seems to be created with WordPress CMS. If yes, please try installing our Embed Form plugin: https://wordpress.org/plugins/embed-form/. I can also help you troubleshoot this directly on the website if you can share with me an admin login. You can invite support@jotform.com if you don't want to share your current login. 

    Thank you.

  • Profile Image
    sageparenting
    Answered on June 07, 2020 at 05:28 PM
    Changed it to 9000 but it's exactly the same.
    My website is in Show It, so I can't edit pages in Wordpress (so a
    wordpress plugin wouldn't help). I would happily give you wordpress login
    credentials, but when I log in to wordpress, this page isn't even there
    (because it's in Show It).
    In Show It, all I'm doing is pasting the embed code. Can you send me embed
    code that will work and I can just paste it in?
    ...
  • Profile Image
    BDAVID
    Answered on June 07, 2020 at 06:38 PM

    Hi, please try embedding the Iframe code with the scrolling property set to "Yes", please try this:

    <iframe id="JotFormIFrame-200577050904046" title="Coaching Agreement" onload="window.parent.scrollTo(0,0)" allowtransparency="true" allowfullscreen="true" allow="geolocation; microphone; camera" src="https://form.jotform.com/200577050904046" frameborder="0" style="min-width: 100%; height:539px; border:none;" scrolling="yes"></iframe>