# Embed API

By embedding eformsign service pages in their legacy web application, customers can integrate and utilize eformsign electronic document services and workflow processes without actually visiting the eformsign site as if eformsign document service is a part of their legacy system. You will learn how to:

* Embed an eformsign template in a webpage for the user to create a document
* Get input data and recipients' information of the completed document

### Load hosted libraries for Embed API

{% code title="embedded-api.html" %}

```html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<!-- Load hosted libraries for EMBED API -->
<script src="https://www.eformsign.com/plugins/jquery/jquery.min.js"></script>
<script src="https://www.eformsign.com/lib/js/efs_embedded_v2.js"></script>
</head>
<body>
  <span style="font-family: Arial, sans-serif;">
      From your legacy application, you can open, fill in and submit eformsign documents.
  </span><br>
<!-- declare iframe for eformsign page -->
  <iframe id="eformsign_iframe" width="1080" height="850">
  </iframe>
<script>
// login user
const user_key = "john.kim@forcs.com"; //const user_key = Date.now() + "";
console.log("user_key: " + user_key);
var eformsign = new EformSignDocument();
// prepare document option values
var document_option = {
    "company": {
        "id": '2b99....f427', // company id 
        "country_code": "sg", // sg, kr, ja
        "user_key": user_key 
                    // Compare the [user_key] with [outside_key] in browser local storage. 
                    // force login if different.
    },
    "mode": {
        "type": "01", // 01: create a document from the template, 
                    // 02: update the document, 
                    // 03: preview the document
        "template_id": "44fc...3937", // form id
        "document_id": ""  // to edit a document
    },
    "user": {
        "type": "01", // 01: internal user, 
                    // 02: external user
        "id": "john.kim@forcs.com" // default login id in the login form
    },
    "layout" : {
        "lang_code" : "en", // display language: ko, en, ja
        "header" : true, // eformsign header
        "footer" : true  // eformsign footer
    },
    "prefill": {
        "document_name": "Leave Request Form",
        "fields": [
        ]
    },
    "return_fields": [ // specify fields to get input values in return
        "Name",
        "Department",
        "From",
        "To",
        "Reason",
        "Other",
        "Employee_Sign_Date"
    ],
    "recipients": [
        {
        }
    ]
};
// success callback
var success_callback = function (response) {
    console.log("response.code: " + response.code);
    if (response.code == "-1") { 
        console.log(response.document_id);
        console.log(response.title);
        console.table(response.values);
        console.table(response.recipients);
        alert("Submitted successfully.");
        $('#eformsign_iframe').remove();
    } else if (response.code == "0") {
        alert("Logged out.");
    }    
};
// error callback
var error_callback = function (response) {
    console.log("response.code: " + response.code + ", message: " + response.message);
    alert("Failed to submit.");
    $('#eformsign_iframe').remove();
};
// set document options
eformsign.document(document_option, "eformsign_iframe", success_callback, error_callback); 
// open document
eformsign.open();
</script>
</body>
</html>
```

{% endcode %}

#### document\_option

{% hint style="danger" %}
Document option settings with Embed API will override those set in the Template management of the eformsign service.
{% endhint %}

## Example

### Employee

1\. Open the [embeded-api.html](http://oz.ozeform.io/oz/edu/eformsign/embedded-api.html)

2\. Complete the request and **Send** it to the approver

### Approver

1. Log into the eformsign service as the approver.
2. Open the document from the **Action required** document box.
3. Complete the OFFICE USE ONLY section and **Complete**.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://efs.ozeform.io/embed-api.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
