How to add additional form fields for signers when sending a document from a template using API?
BoldSign supports adding new form fields when sending a document from a template, in addition to the existing form fields available in that template.
You can add additional form fields in the formFields array when sending the document from the template.
Follow the steps below to send a document for signature using an already created template:
- Create a template in BoldSign's web app. Refer to How to Create a Template in the BoldSign Web App for instructions.
- Copy the ID of the template.
- Use the copied template ID and send the document to your signers by adding additional form fields.
Here are example codes that you can use for this purpose:
Code snippet
curl --location --request POST 'https://api.boldsign.com/v1/template/send?templateId={templateID}' \
--header 'Content-Type: application/json' \
--header 'Authorization: Bearer eyJhbG...' \
--data-raw '{
"roles": [
{
"roleIndex": 1,
"signerEmail": "david@cubeflakes.com",
"signerName": "David",
"formFields": [
{
"id": "Image",
"name": "Image",
"fieldType": "Image",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 100,
"width": 125,
"height": 25
},
"imageInfo": {
"title": "Image title",
"description": "Image description",
"allowedFileExtensions": ".jpg, .png"
},
"isRequired": true
},
{
"id": "TextBox",
"name": "TextBox",
"fieldType": "TextBox",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 200,
"width": 125,
"height": 25
},
"isRequired": true,
"value": "Prefilled Value"
},
{
"id": "EditableDate",
"name": "EditableDate",
"fieldType": "EditableDate",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 300,
"width": 125,
"height": 25
},
"editableDateFieldSettings": {
"dateFormat": "dd/MM/yyyy",
"minDate": "2023-12-01T18:18:08.567Z",
"maxDate": "2023-12-28T18:18:08.567Z"
}
},
{
"id": "DateSigned",
"name": "DateSigned",
"fieldType": "DateSigned",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 400,
"width": 125,
"height": 25
},
"isRequired": true,
"dateFormat": "dd/MM/yyyy"
},
{
"id": "DropDown",
"name": "DropDown",
"fieldType": "DropDown",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 500,
"width": 125,
"height": 25
},
"isRequired": true,
"dropdownOptions":["Male", "Female"],
"value": "Male"
},
{
"id": "HyperLink",
"name": "HyperLink",
"fieldType": "HyperLink",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 600,
"width": 150,
"height": 50
},
"hyperlinkText": "hyperlinkText",
"value": "https://www.google.com"
},
{
"id": "Label",
"name": "Label",
"fieldType": "Label",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 700,
"width": 200,
"height": 25
},
"value": "https://dev-app.boldsign.com/"
},
{
"id": "Attachment",
"name": "Attachment",
"fieldType": "Attachment",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 100,
"width": 125,
"height": 25
},
"isRequired": true,
"attachmentInfo": {
"acceptedFileTypes": ["PDF", "DOCUMENT", "IMAGE"],
"title": "Attachment title",
"description": "Please attach the proof"
}
},
{
"id": "Company",
"name": "Company",
"fieldType": "Company",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 200,
"width": 125,
"height": 25
},
"isRequired": true
},
{
"id": "Title",
"name": "Title",
"fieldType": "Title",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 300,
"width": 125,
"height": 25
},
"isRequired": true
},
{
"id": "RadioButton",
"name": "RadioButton",
"fieldType": "RadioButton",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 400,
"width": 50,
"height": 25
},
"groupName": "RadioChild"
},
{
"id": "CheckBox",
"name": "CheckBox",
"fieldType": "CheckBox",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 500,
"width": 50,
"height": 25
},
"isChecked": true,
"isRequired": true
},
{
"id": "Initial",
"name": "Initial",
"fieldType": "Initial",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 600,
"width": 125,
"height": 25
},
"isRequired": true
},
{
"id": "Signature",
"name": "Signature",
"fieldType": "Signature",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 700,
"width": 125,
"height": 25
},
"isRequired": true
}
]
}
]
}' \
var apiClient = new ApiClient("https://api.boldsign.com", "{Your API key}");
var templateClient = new TemplateClient(apiClient);
var documentFilePath = new DocumentFilePath
{
ContentType = "application/pdf",
FilePath = "{file path}"
};
var filesToUpload = new List<IDocumentFile>
{
documentFilePath,
};
var DateSignedField = new DateSignedField(
isRequired: true,
pageNumber: 1,
bounds: new Rectangle(x: 100, y: 100, width: 125, height: 25),
dateFormat:"dd/MM/yyyy",
id: "DateSignedField"
);
var EditableDateField = new FormField(
id: "EditableDate",
isRequired: true,
type: FieldType.EditableDate,
pageNumber: 1,
bounds: new Rectangle(x: 100, y: 200, width: 125, height: 25),
editableDateFieldSettings: new EditableDateFieldSettings(dateFormat:"dd/MM/yyyy", minDate: DateTime.Now, maxDate: DateTime.Now.AddDays(10)));
var TextBoxField = new FormField(
id: "TextBox",
isRequired: true,
value: "Prefilled Value",
dataSyncTag: "1",
type: FieldType.TextBox,
pageNumber: 1,
bounds: new Rectangle(x: 100, y: 300, width: 125, height: 25));
var dropdownField = new DropdownField(
id: "DropDown",
isRequired: true,
dropdownOptions: new List<string> { "Male", "Female" },
value: "Male",
pageNumber: 1,
bounds: new Rectangle(x: 100, y: 400, width: 125, height: 25));
var imageField = new FormField(
id: "Image",
isRequired: true,
type: FieldType.Image,
pageNumber: 1,
imageInfo: new ImageInfo(title: "Image title", description: "Image description", allowedFileExtensions: ".jpg, .png"),
bounds: new Rectangle(x: 100, y: 500, width: 125, height: 25));
var signatureField = new FormField(
id: "Signature",
isRequired: true,
type: FieldType.Signature,
pageNumber: 1,
bounds: new Rectangle(x: 100, y: 600, width: 125, height: 25));
var initialField = new FormField(
id: "Initial",
isRequired: true,
type: FieldType.Initial,
pageNumber: 1,
bounds: new Rectangle(x: 100, y: 700, width: 125, height: 25));
var attachmentField = new FormField(
id: "Attachment",
isRequired: true,
type: FieldType.Attachment,
pageNumber: 1,
attachmentInfo: new AttachmentInfo(title: "Attachment title", description: "Please attach the proof", acceptedFileTypes: ["PDF", "DOCUMENT", "IMAGE"]),
bounds: new Rectangle(x: 400, y: 100, width: 125, height: 25));
var hyperlinkField = new FormField(
id: "Hyperlink",
isRequired: true,
type: FieldType.Hyperlink,
pageNumber: 1,
hyperlinkText: "Click here",
value: "https://www.google.com",
bounds: new Rectangle(x: 400, y: 200, width: 125, height: 25));
var labelField = new FormField(
id: "Label",
isRequired: true,
type: FieldType.Label,
pageNumber: 1,
value: "https://www.google.com",
bounds: new Rectangle(x: 400, y: 300, width: 125, height: 25));
var companyField = new FormField(
id: "Company",
isRequired: true,
type: FieldType.Company,
pageNumber: 1,
bounds: new Rectangle(x: 400, y: 400, width: 125, height: 25));
var titleField = new FormField(
id: "Title",
isRequired: true,
type: FieldType.Title,
pageNumber: 1,
bounds: new Rectangle(x: 400, y: 500, width: 125, height: 25));
var radioButtonField = new RadioButtonField(
id: "RadioButton",
isRequired: true,
groupName: "Radio",
pageNumber: 1,
bounds: new Rectangle(x: 400, y: 600, width: 125, height: 25));
var checkBoxField = new FormField(
id: "CheckBox",
isRequired: true,
type: FieldType.CheckBox,
pageNumber: 1,
bounds: new Rectangle(x: 400, y: 700, width: 125, height: 25));
var formFieldCollections = new List<FormField>()
{
imageField,
DateSignedField,
EditableDateField,
TextBoxField,
dropdownField,
signatureField,
initialField,
attachmentField,
hyperlinkField,
labelField,
companyField,
titleField,
radioButtonField,
checkBoxField
};
var role = new Roles(
roleIndex: 1,
signerName: "David",
signerEmail: "david@cubeflakes.com",
formFields: formFieldCollections);
var roles = new List<Roles>()
{
role
};
var sendForSignFromTemplate = new SendForSignFromTemplate()
{
Title = "Sample Document",
TemplateId = "040e6671-c9a8-426d-a0c5-ad2700d80f40",
Roles = roles
};
var templateCreated = templateClient.SendUsingTemplate(sendForSignFromTemplate);
import requests
url = "https://api.boldsign.com/v1/template/send?templateId={templateID}"
payload = {
"roles": [
{
"roleIndex": 1,
"signerName": "David",
"signerEmail": "david@cubeflakes.com",
"formFields": [
{
"id": "Image",
"name": "Image",
"fieldType": "Image",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 100,
"width": 125,
"height": 25
},
"imageInfo": {
"title": "Image title",
"description": "Image description",
"allowedFileExtensions": ".jpg, .png"
},
"isRequired": True
},
{
"id": "TextBox",
"name": "TextBox",
"fieldType": "TextBox",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 200,
"width": 125,
"height": 25
},
"isRequired": True,
"value": "Prefilled Value"
},
{
"id": "EditableDate",
"name": "EditableDate",
"fieldType": "EditableDate",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 300,
"width": 125,
"height": 25
},
"editableDateFieldSettings": {
"dateFormat": "dd/MM/yyyy",
"minDate": "2023-12-01T18:18:08.567Z",
"maxDate": "2023-12-28T18:18:08.567Z"
}
},
{
"id": "DateSigned",
"name": "DateSigned",
"fieldType": "DateSigned",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 400,
"width": 125,
"height": 25
},
"isRequired": True,
"dateFormat": "dd/MM/yyyy"
},
{
"id": "DropDown",
"name": "DropDown",
"fieldType": "DropDown",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 500,
"width": 125,
"height": 25
},
"isRequired": True,
"dropdownOptions":["Male", "Female"],
"value": "Male"
},
{
"id": "HyperLink",
"name": "HyperLink",
"fieldType": "HyperLink",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 600,
"width": 150,
"height": 50
},
"hyperlinkText": "hyperlinkText",
"value": "https://www.google.com"
},
{
"id": "Label",
"name": "Label",
"fieldType": "Label",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 700,
"width": 200,
"height": 25
},
"value": "https://dev-app.boldsign.com/"
},
{
"id": "Attachment",
"name": "Attachment",
"fieldType": "Attachment",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 100,
"width": 125,
"height": 25
},
"isRequired": True,
"attachmentInfo": {
"acceptedFileTypes": ["PDF", "DOCUMENT", "IMAGE"],
"title": "Attachment title",
"description": "Please attach the proof"
}
},
{
"id": "Company",
"name": "Company",
"fieldType": "Company",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 200,
"width": 125,
"height": 25
},
"isRequired": True
},
{
"id": "Title",
"name": "Title",
"fieldType": "Title",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 300,
"width": 125,
"height": 25
},
"isRequired": True
},
{
"id": "RadioButton",
"name": "RadioButton",
"fieldType": "RadioButton",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 400,
"width": 50,
"height": 25
},
"groupName": "RadioChild"
},
{
"id": "CheckBox",
"name": "CheckBox",
"fieldType": "CheckBox",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 500,
"width": 50,
"height": 25
},
"isChecked": True,
"isRequired": True
},
{
"id": "Initial",
"name": "Initial",
"fieldType": "Initial",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 600,
"width": 125,
"height": 25
},
"isRequired": True
},
{
"id": "Signature",
"name": "Signature",
"fieldType": "Signature",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 700,
"width": 125,
"height": 25
},
"isRequired": True
}
]
}
]
}
headers = {
'accept': 'application/json',
'X-API-KEY': '{Your API key}',
'Content-Type': 'application/json;odata.metadata=minimal;odata.streaming=true'
}
response = requests.post(url, headers=headers, json=payload)
print(response.text)
const axios = require('axios');
const response = await axios.post(
'https://api.boldsign.com/v1/template/send',
{
'roles': [
{
'roleIndex': 1,
'signerName': 'David',
'signerEmail': 'david@cubeflakes.com',
'formFields': [
{
"id": "Image",
"name": "Image",
"fieldType": "Image",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 100,
"width": 125,
"height": 25
},
"imageInfo": {
"title": "Image title",
"description": "Image description",
"allowedFileExtensions": ".jpg, .png"
},
"isRequired": true
},
{
"id": "TextBox",
"name": "TextBox",
"fieldType": "TextBox",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 200,
"width": 125,
"height": 25
},
"isRequired": true,
"value": "Prefilled Value"
},
{
"id": "EditableDate",
"name": "EditableDate",
"fieldType": "EditableDate",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 300,
"width": 125,
"height": 25
},
"editableDateFieldSettings": {
"dateFormat": "dd/MM/yyyy",
"minDate": "2023-12-01T18:18:08.567Z",
"maxDate": "2023-12-28T18:18:08.567Z"
}
},
{
"id": "DateSigned",
"name": "DateSigned",
"fieldType": "DateSigned",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 400,
"width": 125,
"height": 25
},
"isRequired": true,
"dateFormat": "dd/MM/yyyy"
},
{
"id": "DropDown",
"name": "DropDown",
"fieldType": "DropDown",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 500,
"width": 125,
"height": 25
},
"isRequired": true,
"dropdownOptions":["Male", "Female"],
"value": "Male"
},
{
"id": "HyperLink",
"name": "HyperLink",
"fieldType": "HyperLink",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 600,
"width": 150,
"height": 50
},
"hyperlinkText": "hyperlinkText",
"value": "https://www.google.com"
},
{
"id": "Label",
"name": "Label",
"fieldType": "Label",
"pageNumber": 1,
"bounds": {
"x": 50,
"y": 700,
"width": 200,
"height": 25
},
"value": "https://dev-app.boldsign.com/"
},
{
"id": "Attachment",
"name": "Attachment",
"fieldType": "Attachment",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 100,
"width": 125,
"height": 25
},
"isRequired": true,
"attachmentInfo": {
"acceptedFileTypes": ["PDF", "DOCUMENT", "IMAGE"],
"title": "Attachment title",
"description": "Please attach the proof"
}
},
{
"id": "Company",
"name": "Company",
"fieldType": "Company",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 200,
"width": 125,
"height": 25
},
"isRequired": true
},
{
"id": "Title",
"name": "Title",
"fieldType": "Title",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 300,
"width": 125,
"height": 25
},
"isRequired": true
},
{
"id": "RadioButton",
"name": "RadioButton",
"fieldType": "RadioButton",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 400,
"width": 50,
"height": 25
},
"groupName": "RadioChild"
},
{
"id": "CheckBox",
"name": "CheckBox",
"fieldType": "CheckBox",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 500,
"width": 50,
"height": 25
},
"isChecked": true,
"isRequired": true
},
{
"id": "Initial",
"name": "Initial",
"fieldType": "Initial",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 600,
"width": 125,
"height": 25
},
"isRequired": true
},
{
"id": "Signature",
"name": "Signature",
"fieldType": "Signature",
"pageNumber": 1,
"bounds": {
"x": 400,
"y": 700,
"width": 125,
"height": 25
},
"isRequired": true
}
],
}
]
},
{
params: {
'templateId': '{templateID}'
},
headers: {
'accept': 'application/json',
'X-API-KEY': '{your API key}',
'Content-Type': 'application/json;odata.metadata=minimal;odata.streaming=true'
}
}
);
In the above examples, add the form fields to the formFields array and set the values for signerName and signerEmail. After executing the above code, the document will be created with additional form fields, and an email will be sent to the signer. The signer can then fill out those form fields in the document and complete the signing.