Signing screen in hidden iframe causes failed document load in groupdocs

GroupDocs.Signature Product Family
1

Hi


Quite a weird issue in the fact that it works with groupdocs previewer but not signature. Anyway I am presenting the signature view in an IFrame and I want to keep it hidden until the load is complete so I am using:

$("#groupdocs-signature").groupdocsSignature(“on”, “documentLoadCompleted.groupdocs”, function() {
parent.postMessage(“loadingComplete”, “");
});

But the document fails to load ( I get the groupdocs modal error popup saying the document could not be loaded). If I then un-hide the IFrame and try again it loads no problem.

However when doing the exact same thing for previewer using the below code it works fine:

var containerElement = $("#previewer");
containerElement.groupdocsViewer(“on”, “documentLoadCompleted.groupdocs”,
function (e) {
parent.postMessage(“loadingComplete”, "”);
});

So basically if the IFrame is hidden groupdocs errors when trying to load the document, but only in signature not in previewer. Is this some threading issue or am I calling the load on the wrong element or too early for the signature version?

2

Hello,


We are sorry to hear that you have such issue. To be able to reproduce and resolve this issue we will need an example of your code. Since that could you please share with us full code of the page where you embed GroupDocs.Signature.

Thank you.
3
Here is the view and the controller, nothing special happening really. But it is very odd behaviour, it works perfectly if I don't hide the CSS element containing the view, otherwise it fails to load and If I manually edit the source to un-hide the CSS element I can see the signing screen error.

View:
@using Groupdocs.Web.UI.Signature
@model HowNow.Signature.Models.SignModel
@{
ViewBag.Title = "Index";
}
@section Head
{
@Html.CreateSignatureStylesLoadBlock()
}
@(Html.Signature("#groupdocs-signature")
.DocumentGuid(Model.Document.Guid)
.RecipientGuid(Model.Document.SignatureDocumentRecipients.FirstOrDefault().Guid)
);

@Html.CreateSignatureScriptsLoadBlock()


Controller:
public class SignController : Controller
{
public readonly string tempDir = "~/tmp/";
public readonly string groupDocsDir = "~/app_data";
// GET: Sign
public async Task Index(string url, string finishedurl)
{
var client = new HttpClient();
var stream = await client.GetStreamAsync(url);
var uri = new Uri(url);

bool existsApp = System.IO.Directory.Exists(Server.MapPath(groupDocsDir));
if (!existsApp) System.IO.Directory.CreateDirectory(Server.MapPath(groupDocsDir));
bool existsTmp = System.IO.Directory.Exists(Server.MapPath(tempDir));
if (!existsTmp) System.IO.Directory.CreateDirectory(Server.MapPath(tempDir));
var filepath = Path.Combine(Server.MapPath(tempDir), uri.Segments[uri.Segments.Length - 1]);
using (var file = System.IO.File.Create(filepath))
{
stream.CopyTo(file);
}

var signedFilepath = Path.Combine(Server.MapPath(tempDir),
Path.GetFileNameWithoutExtension(filepath) + "_signed" + Path.GetExtension(filepath));

var document = FluentSignature.Document()
.FileName(Path.GetFileName(filepath))
.SignedFileName(Path.GetFileName(signedFilepath))
.AddRecipient(FluentSignature.Recipient()
.AddField(FluentSignature.Field()
.Name("Signature1")
.Mandatory(true)
.LockDuringSign(false)
.Type(SignatureFieldType.Signature)
.AddLocation(FluentSignature.Location()
.Page(1)
.LocationWidth(150)
.LocationHeight(50)
.LocationX((decimal) 0.400)
.LocationY((decimal) 0.300)
)
)
)
.Create();

var signModel = new SignModel()
{
Document = document,
UploadUrl = url,
};

return View(signModel);
}
}

Iframe Parent (embedded signing view):

Where ng-show="!documentLoading" sets the display of the element to none while it waits for load.

When the element display is set to none it errors with the following :

A first chance exception of type 'System.ArgumentOutOfRangeException' occurred in Groupdocs.Auxiliary
A first chance exception of type 'System.ArgumentOutOfRangeException' occurred in Groupdocs.Web.UI.Signature.dll
4

Hello Sam,


Thank you for the code sharing. We have checked your code and we found out that you use .NET framework 4.5, is it correct?

Also could you please share with us your HttpClient class code.

Thank you.
5

Yes I am using .net 4.5.

I am not utilising the HttpClient for this current request. That is for after the document has been signed.


The problem is initially loading the document inside an iframe with the css style property of “display” set to “none”.

I am using a parent.PostMessage() call in javascript to send the event trigger to tell my web application to set the display back to the original setting of “inline” or “block” etc.

The problem is right in this part of the code in the index.cshtml:

$("#groupdocs-signature").groupdocsSignature(“on”, “documentLoadCompleted.groupdocs”, function() {
parent.postMessage(“loadingComplete”, “*”);
});

It doesn’t get called if the css element’s display property is set to none.
6

Hello,


Thank you for the confirmation. To resolve the issue please try to use visibility: hidden instead display: none.

Please notify us with the results.

Thank you.
7

Hey

Thanks the visibility: hidden attribute gives the intended functionality.

If it’s not too much trouble may I ask why setting the display property to none on the element causes an issue.


I’m just wondering why would it work for the previewing library but not the signature library?
8

Hello,


We glad to hear that our recommendation was useful. As you know different browser render CSS parameters in different way. Since that the display:none parameter can cause unexpected problems with the processing of your functional, disply: hidden is much more “stable”.

As for why display: none works for the Viewer - GroupDocs.Signature uses allot more HTML elements and CSS parameters since GroupDocs.Viewer (for fields on the document) and to be able to add all these to the document it should be loaded and accessible for the JavaScript widget and when you use display: none that may cause that the element with this parameter didn’t loaded instead of when you use display: hidden it’s fully loaded but not shown for the user.