Skip to content

Commit be355e3

Browse files
Merge branch 'development' into EJ2-1011820-dev
2 parents 8aeeb86 + 877c9ad commit be355e3

335 files changed

Lines changed: 15182 additions & 6589 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

Document-Processing-toc.html

Lines changed: 55 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -942,7 +942,7 @@
942942
</ul>
943943
</li>
944944
<li><a href="/document-processing/pdf/pdf-viewer/react/mobile-toolbar">Mobile Toolbar Interface</a></li>
945-
<li><a href="/document-processing/pdf/pdf-viewer/react/toolbar">Toolbar Customization</a>
945+
<li><a href="/document-processing/pdf/pdf-viewer/react/toolbar-customization/overview">Toolbar</a>
946946
<ul>
947947
<li><a href="/document-processing/pdf/pdf-viewer/react/toolbar-customization/primary-toolbar">Primary Toolbar</a></li>
948948
<li><a href="/document-processing/pdf/pdf-viewer/react/toolbar-customization/annotation-toolbar">Annotation Toolbar</a></li>
@@ -965,18 +965,51 @@
965965
<li><a href="/document-processing/pdf/pdf-viewer/react/text-search">Text Search</a></li>
966966
<li>Annotation
967967
<ul>
968-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/text-markup-annotation">Text Markup Annotation</a></li>
969-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/shape-annotation">Shape Annotation</a></li>
970-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/stamp-annotation">Stamp Annotation</a></li>
971-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/sticky-notes-annotation">Sticky NotesAnnotation</a></li>
972-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/measurement-annotation">Measurement Annotation</a></li>
973-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/free-text-annotation">Free Text Annotation</a></li>
974-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/ink-annotation">Ink Annotation</a></li>
975-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/line-angle-constraints">Line Angle Constraints</a></li>
976-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/comments">Comments</a></li>
977-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/signature-annotation">Handwritten signature</a></li>
978-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-event">Annotations Events</a></li>
979-
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotations-in-mobile-view">Annotations in Mobile view</a></li>
968+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/overview">Overview</a></li>
969+
<li>Annotation Types
970+
<ul>
971+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/highlight-annotation">Highlight</a></li>
972+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/underline-annotation">Underline</a></li>
973+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/strikethrough-annotation">Strikethrough</a></li>
974+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/squiggly-annotation">Squiggly</a></li>
975+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/line-annotation">Line</a></li>
976+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/arrow-annotation">Arrow</a></li>
977+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/rectangle-annotation">Rectangle</a></li>
978+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/circle-annotation">Circle</a></li>
979+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/polygon-annotation">Polygon</a></li>
980+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/ink-annotation">Ink</a></li>
981+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/stamp-annotation">Stamp</a></li>
982+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/sticky-notes">Sticky Notes</a></li>
983+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/redaction-annotation">Redaction</a></li>
984+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/free-text-annotation">Free Text</a></li>
985+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/distance-annotation">Distance</a></li>
986+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/perimeter-annotation">Perimeter</a></li>
987+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/area-annotation">Area</a></li>
988+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/radius-annotation">Radius</a></li>
989+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-types/volume-annotation">Volume</a></li>
990+
</ul>
991+
</li>
992+
<li><a href="/document-processing/pdf/pdf-viewer/react/toolbar-customization/annotation-toolbar">Annotation Toolbar</a></li>
993+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/create-modify-annotation">Create and modify Annotation</a></li>
994+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/customize-annotation">Customize Annotation</a></li>
995+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/delete-annotation">Remove Annotation</a></li>
996+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotations-undo-redo">Undo or Redo Annotation Changes</a></li>
997+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-permission">Annotation Permission</a></li>
998+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/signature-annotation">Handwritten Signature</a></li>
999+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/line-angle-constraints">Line Angle Constraint</a></li>
1000+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/custom-data">Adding custom Data in annotations</a></li>
1001+
<li>Export and Import Annotations
1002+
<ul>
1003+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/export-import/export-annotation">Export Annotation</a></li>
1004+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/export-import/import-annotation">Import Annotation</a></li>
1005+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/export-import/export-import-events">Export and Import Events</a></li>
1006+
</ul>
1007+
</li>
1008+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/comments">Comments and Replies</a></li>
1009+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotation-event">Annotation Events</a></li>
1010+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/custom-tools">Custom tools</a></li>
1011+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotations-in-mobile-view">Annotation in Mobile View</a></li>
1012+
<li><a href="/document-processing/pdf/pdf-viewer/react/annotation/annotations-api">APIs</a></li>
9801013
</ul>
9811014
</li>
9821015
<li>Redaction
@@ -1020,13 +1053,18 @@
10201053
<li><a href="/document-processing/pdf/pdf-viewer/react/forms/form-fields-api">APIs</a></li>
10211054
</ul>
10221055
</li>
1023-
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pdf">Organize Pages</a>
1056+
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/overview">Organize Pages</a>
10241057
<ul>
1025-
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/overview">Overview</a></li>
1058+
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/copy-pages">Copy pages</a></li>
1059+
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/import-pages">Import pages</a></li>
1060+
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/insert-blank-pages">Insert blank pages</a></li>
1061+
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/remove-pages">Remove pages</a></li>
1062+
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/reorder-pages">Reorder pages</a></li>
1063+
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/rotate-pages">Rotate pages</a></li>
1064+
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/zoom-pages">Zoom pages</a></li>
1065+
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/extract-pages">Extract Pages</a></li>
10261066
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/programmatic-support">Programmatic Support</a></li>
1027-
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/ui-interactions">UI Interactions</a></li>
10281067
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/toolbar">Toolbar</a></li>
1029-
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/extract-pages">Extract Pages</a></li>
10301068
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/mobile-view">Mobile View</a></li>
10311069
<li><a href="/document-processing/pdf/pdf-viewer/react/organize-pages/events">Events</a></li>
10321070
</ul>

Document-Processing/PDF/PDF-Library/javascript/DigitalSignature.md

Lines changed: 130 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -884,5 +884,135 @@ var signedDocumentData = ej.pdf.PdfSignature.replaceEmptySignature(
884884
// Destroy the document
885885
document.destroy();
886886

887+
{% endhighlight %}
888+
{% endtabs %}
889+
890+
## Sign existing signature field
891+
892+
This section explains how to sign an existing unsigned signature field in a PDF using the JavaScript PDF library. You can locate predefined signature fields and apply a digital signature directly by calling `PdfSignatureField.setSignature()` method, without altering the document layout. This is ideal for templates where signature placeholders already exist, allowing you to add digital signatures to the field using a certificate and signature settings.
893+
894+
{% tabs %}
895+
{% highlight typescript tabtitle="TypeScript" %}
896+
import {PdfDocument, PdfForm, DigestAlgorithm, CryptographicStandard, PdfSignatureField} from '@syncfusion/ej2-pdf';
897+
898+
// Load an existing PDF document
899+
let document: PdfDocument = new PdfDocument(data);
900+
// Access loaded form
901+
let form: PdfForm = document.form;
902+
// Access the loaded form field
903+
let field: PdfSignatureField = form.fieldAt(0) as PdfSignatureField;
904+
// Create a digital signature with CMS + SHA-256
905+
const signature: PdfSignature = PdfSignature.create(certificate, 'password', {
906+
digestAlgorithm: DigestAlgorithm.sha256,
907+
cryptographicStandard: CryptographicStandard.cms
908+
});
909+
// Apply the signature to the field
910+
field.setSignature(signature);
911+
// Save the document
912+
document.save('Output.pdf');
913+
// Close the document
914+
document.destroy();
915+
916+
{% endhighlight %}
917+
{% highlight javascript tabtitle="JavaScript" %}
918+
919+
// Load an existing PDF document
920+
var document = new ej.pdf.PdfDocument(data);
921+
// Access loaded form
922+
var form = document.form;
923+
// Access the loaded form field
924+
var field = form.fieldAt(0);
925+
// Create a digital signature with CMS + SHA-256
926+
const signature = ej.pdf.PdfSignature.create(certificate, 'password', {
927+
digestAlgorithm: ej.pdf.DigestAlgorithm.sha256,
928+
cryptographicStandard: ej.pdf.CryptographicStandard.cms
929+
});
930+
// Apply the signature to the field
931+
field.setSignature(signature);
932+
// Save the document
933+
document.save('Output.pdf');
934+
// Close the document
935+
document.destroy();
936+
937+
{% endhighlight %}
938+
{% endtabs %}
939+
940+
## Remove existing digital signature
941+
942+
This section explains how to remove an existing digital signature from a PDF by using `PdfForm.removeField()` method to delete the signature field entirely. Removing the field clears the signature dictionary, allowing the document to be edited, corrected, or re‑signed as needed. This is useful when preparing a PDF for updates or resolving signature‑related issues.
943+
944+
{% tabs %}
945+
{% highlight typescript tabtitle="TypeScript" %}
946+
import {PdfDocument, PdfForm, PdfSignatureField} from '@syncfusion/ej2-pdf';
947+
948+
// Load an existing PDF document
949+
let document: PdfDocument = new PdfDocument(data);
950+
// Access loaded form
951+
let form: PdfForm = document.form;
952+
// Access the loaded form field
953+
let field: PdfSignatureField = form.fieldAt(0) as PdfSignatureField;
954+
// Remove the signature field
955+
if (field instanceof PdfSignatureField) {
956+
document.form.removeField(field);
957+
}
958+
// Destroy the document
959+
document.destroy();
960+
961+
{% endhighlight %}
962+
{% highlight javascript tabtitle="JavaScript" %}
963+
964+
// Load an existing PDF document
965+
var document = new ej.pdf.PdfDocument(data);
966+
// Access loaded form
967+
var form = document.form;
968+
// Access the loaded form field
969+
var field = form.fieldAt(0);
970+
// Remove the signature field
971+
if (field instanceof ej.pdf.PdfSignatureField) {
972+
document.form.removeField(field);
973+
}
974+
// Destroy the document
975+
document.destroy();
976+
977+
{% endhighlight %}
978+
{% endtabs %}
979+
980+
## Document revisions
981+
982+
Digital signatures in a PDF create new revisions, keeping every previous version intact. These revisions let you see how the document looked when each signature was applied and check if anything changed later. You can access all revisions using `PdfDocument.getRevisions()` method or get a specific one using `PdfSignatureField.getRevision()` method.
983+
984+
{% tabs %}
985+
{% highlight typescript tabtitle="TypeScript" %}
986+
import {PdfDocument, PdfForm, PdfSignatureField} from '@syncfusion/ej2-pdf';
987+
988+
// Load an existing PDF document
989+
let document: PdfDocument = new PdfDocument(data);
990+
// Access loaded form
991+
let form: PdfForm = document.form;
992+
// Access the loaded form field
993+
let signature: PdfSignatureField = form.fieldAt(0);
994+
// Retrieve all revision indexes of the PDF document
995+
let revisions: number[] = document.getRevisions();
996+
// Gets the revision number associated with the signature field
997+
let revision: number = signature.getRevision();
998+
// Destroy the document
999+
document.destroy();
1000+
1001+
{% endhighlight %}
1002+
{% highlight javascript tabtitle="JavaScript" %}
1003+
1004+
// Load an existing PDF document
1005+
var document = new ej.pdf.PdfDocument(data);
1006+
// Access loaded form
1007+
var form = document.form;
1008+
// Access the loaded form field
1009+
var signature = form.fieldAt(0);
1010+
// Retrieve all revision indexes of the PDF document
1011+
var revisions = document.getRevisions();
1012+
// Gets the revision number associated with the signature field
1013+
var revision = signature.getRevision();
1014+
// Destroy the document
1015+
document.destroy();
1016+
8871017
{% endhighlight %}
8881018
{% endtabs %}

Document-Processing/PDF/PDF-Library/javascript/FormFields.md

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -851,6 +851,70 @@ document. Destroy();
851851
{% endhighlight %}
852852
{% endtabs %}
853853

854+
## Add a date field to a PDF form
855+
856+
This section shows how to add a date field to a PDF form, allowing users to enter or select a date within the document. The JavaScript PDF library lets you configure the date field’s appearance, format, and behavior. You can also attach actions that run custom scripts or validations whenever the field is focused, changed, or submitted.
857+
858+
{% tabs %}
859+
{% highlight typescript tabtitle="TypeScript" %}
860+
import {PdfDocument, pdfPage, PdfForm, PdfTextBoxField, PdfJavaScriptAction } from '@syncfusion/ej2-pdf';
861+
862+
// Create a new PDF document
863+
let document: PdfDocument = new PdfDocument();
864+
// Add a new page to the document
865+
let page: pdfPage = document.addPage();
866+
// Access loaded form
867+
let form: PdfForm = document.form;
868+
// Create a new text box field
869+
const field: PdfTextBoxField = new PdfTextBoxField(page, 'DateField', {
870+
x: 50, y: 200, width: 150, height: 20,
871+
});
872+
// Sets the text value to text box field
873+
field.text = '18/08/2003';
874+
// Sets date formate
875+
const format: string = 'yyyy-mm-dd';
876+
// Add a JavaScript action to run custom scripts or validations
877+
field.actions.format = new PdfJavaScriptAction(`AFDate_FormatEx("${format}");`);
878+
field.actions.keyPressed = new PdfJavaScriptAction(`AFDate_KeystrokeEx("${format}"):`);
879+
field.actions.validate = new PdfJavaScriptAction(`AFDate_Validate("${format}");`);
880+
// Add a new form field
881+
form.add(field);
882+
// Save the document
883+
document.save('output.pdf');
884+
// Destroy the document
885+
document. Destroy();
886+
887+
{% endhighlight %}
888+
{% highlight javascript tabtitle="JavaScript" %}
889+
890+
// Create a new PDF document instance
891+
var document = new ej.pdf.PdfDocument();
892+
// Add a new page to the document
893+
var page = document.addPage();
894+
// Access loaded form
895+
var form = document.form;
896+
// Create a new text box field
897+
const field = new ej.pdf.PdfTextBoxField(page, 'fieldF', {
898+
x: 50, y: 200, width: 150, height: 20
899+
});
900+
// Sets the text value to text box field
901+
field.text = '18/08/2003';
902+
// Sets date formate
903+
const format = 'yyyy-mm-dd';
904+
// Add a JavaScript action to run custom scripts or validations
905+
field.actions.format = new ej.pdf.PdfJavaScriptAction(`AFDate_FormatEx("${format}");`);
906+
field.actions.keyPressed = new ej.pdf.PdfJavaScriptAction(`AFDate_KeystrokeEx("${format}"):`);
907+
field.actions.validate = new ej.pdf.PdfJavaScriptAction(`AFDate_Validate("${format}");`);
908+
// Add a new form field
909+
form.add(field);
910+
// Save the document
911+
document.save('Output.pdf');
912+
// Destroy the document
913+
document. Destroy();
914+
915+
{% endhighlight %}
916+
{% endtabs %}
917+
854918
## Field Auto Naming
855919

856920
To prevent grouping when adding fields with the same name, you can enable the `fieldAutoNaming` property of `PdfForm` class. Setting fieldAutoNaming to true ensures that each field gets a unique name internally, even if you specify the same name during creation.

0 commit comments

Comments
 (0)