Discussion

Forms Signature dialog in iframe using Chrome

Forms

Updated September 12, 2017

posted on September 11, 2017

One of our customers would like to host a Laserfiche form in an iframe on their website. This is working great except for the fact that when you click the Sign button, it scrolls to the top of the page (off screen). This happens when using Chrome or Firefox but not when using IE. Any ideas of how to fix this?

0 0

Comments 4
Follow-Ups 0

replied on September 12, 2017

Thanks for your suggestion, Rui. However, it did not change the behavior at all. In IE, the dialog is at the top but IE scrolls up. In other browsers, the dialog box is at the top and the browser does not scroll to the top.

0 0

replied on September 12, 2017 • Show version history

Hi Jen,

Here is another workaround for updating dialog position, try add the following to the custom script:

$(document).ready(function() { 
	$('#form-signature-dlg').on('shown.bs.modal', function (e) {
    	if (window.top.document.querySelector('iframe')) {
      		$('#form-signature-dlg').css('top', window.top.scrollY); //set modal position
  		}
    });
});

If this still does not work for you, can you give more details on the html content of webpage used for holding embedded form?

0 0

replied on September 12, 2017

Hi Rui,

They are using Forms 10.2.0.834. Also, my description was off, you are right when in IE, the dialog box is at the top but IE scrolls to the top on its own. We'll try your workaround.

Thanks,

Jen

0 0

replied on September 11, 2017 • Show version history

Hi Jen,

Did the customer use embedded form? Which version of Forms is used?

I tried on Forms 10.2.1 with embedded form, and in my environment, the signature dialog would always show on top of page on Chrome/Firefox/IE. The difference is that on IE, the page would scroll to top. On Chrome/Firefox, the dialog is off screen and you need to manually scroll to top of page to see the dialog.

A work around is to add class "inbox-pane-content" to the element used for holding embedded form. It would look like this:

<div id="test" class="inbox-pane-content"></div>
<script type="text/javascript" src='http://SERVER/Forms/js/forms-embed.js?v=10.2'></script><script type="text/javascript">lfembed = new LaserficheForms.Form(document.getElementById('test'),{bpid: '...', host:'http://SERVER/Forms'}).getFrm();</script>

But since the behavior on my environment is different from the one you described, can you check if this would work for you?

p.s. we will consider supporting calculating the height for embedded form, but this is not available at this moment.

0 0

You are not allowed to follow up in this post.

Discussion

Discussion

Forms Signature dialog in iframe using Chrome

Comments 4

Follow-Ups 0

Sign in to reply to this post.