BoldSignDocumentation
BoldSign Mobile Icon

Create embedded request link

Mon, 24 January, 2022

Create a new document with properties for generating the embedded requesting link.
The below given table shows the different properties available in EmbeddedDocumentRequest and their description:

Property Description
RedirectUrl This property is used to redirect to the URL after the document is sent.
ShowToolbar Boolean to toggle the visibility of the tool bar with options in both filling and prepare pages.
SendViewOption Setting enum to FillingPage will make the user start with document uploading and signers filling page.Setting enum to PreparePage will make the user start with preparing or configuring fields page of the document.
ShowSaveButton Boolean to show the save option in both filling and prepare page, to save the progress of the document.
ShowSendButton Boolean to show the send button in prepare page to send the document out for signature.
ShowPreviewButton Boolean to show the preview of the document to review.
ShowNavigationButtons Boolean to show the navigation buttons in both filling and prepare page.
SendLinkValidTill This property used to set the validity of the generated URL and its maximum validity is 180 days.

Create a new instance of EmbeddedDocumentRequest object with required parameters to send the sign request with the help of documentClient as shown below:

C#CURL

// Create embedded document request object.
var embeddedDocumentRequest = new EmbeddedDocumentRequest
    {
        Title = "Sent from API SDK",
        Message = "This is document message sent from API SDK",
        // Assign the loaded files collection.
        Files = filesToUpload,
        // Assign the signers collection.
        Signers = documentSigners,
        //customize page options
        SendViewOption = PageViewOption.PreparePage,
        ShowToolbar = true,
        RedirectUrl = new Uri("https://boldsign.dev/sign/redirect"),
        SendLinkValidTill = DateTime.UtcNow.AddDays(20),
    };
// generate the embedded send url.
var createdDocumentResult = this.DocumentClient.CreateEmbeddedRequestUrl(embeddedDocumentRequest);

curl -X POST 'https://api.boldsign.com/v1/document/createEmbeddedRequestUrl' \
-H 'Authorization: Bearer <authtoken>' \
-F 'Title=Sent from API Curl' \
-F 'ShowToolbar=true' \
-F 'RedirectUrl=https://boldsign.dev/sign/redirect' \
-F 'Message=This is document message sent from API Curl' \
-F 'EnableSigningOrder=false' \
-F 'Signers[0][Name]=Signer Name 1' \
-F 'Signers[0][EmailAddress]=signer1@boldsign.dev' \
-F 'Signers[0][SignerOrder]=1' \
-F 'Signers[0][authenticationCode]=1123' \
-F 'Signers[0][PrivateMessage]=This is private message for signer' \
-F 'Signers[0][FormFields][0][FieldType]=Signature' \
-F 'Signers[0][FormFields][0][Id]=Sign' \
-F 'Signers[0][FormFields][0][PageNumber]=1' \
-F 'Signers[0][FormFields][0][IsRequired]=True' \
-F 'Signers[0][FormFields][0][Bounds][X]=50' \
-F 'Signers[0][FormFields][0][Bounds][Y]=50' \
-F 'Signers[0][FormFields][0][Bounds][Width]=200' \
-F 'Signers[0][FormFields][0][Bounds][Height]=30' \
-F 'Files=@NDA.pdf;type=application/pdf' \
-F 'RedirectUrl=https://boldsign.dev/sign/redirect' \

After generating embedded URL you can load that URL in client side using iframe as shown below:

<iframe id="prepare_page"
        src="https://app.boldsign.com/document/embed/?documentId=a14b5a72-16f6-41c8-beaf-625ce6c85yu2abe_KYEq55w7;44825143-5cfc-40a4-95c6-b9aee413uua322"
        height="600"
        width="1100"
        class="frame">
</iframe>

Also, we have below client-side events in embedded request API and it will be used to customize the toolbar when we set the ShowToolBar as false.

Event Description
onNextClick It will be used to navigate to filling page to prepare page
onPreviewClick It will be used to navigate the preview page
onSaveAndCloseClick It will be used to save and close the document.
onSendClick It will be used to send the document

Usage

<div style="float:left;">
    <button onclick="onNextClick()">Next</button>
    <button onclick="onPreviewClick()">Preview</button>
    <button onclick="onSaveAndCloseClick()">Save and close</button>
    <button onclick="onSendClick()">Send</button>
</div>
<script>    
var iframeEl = document.getElementById('prepare_page');
    function onNextClick() {
        iframeEl.contentWindow.postMessage("onNextClick", '*');
    }
    function onPreviewClick() {
        iframeEl.contentWindow.postMessage("onPreviewClick", '*');
    }
    function onSaveAndCloseClick() {
        iframeEl.contentWindow.postMessage("onSaveAndCloseClick", '*');
    }
    function onSendClick() {
        iframeEl.contentWindow.postMessage("onSendClick", '*');
    }
</script>
Copied to clipboard