How to Show a Pop-Up After Exporting Form Fields in Angular PDF Viewer

14 Aug 20262 minutes to read

The exportSuccess event fires when exporting annotations or form data completes successfully. Use this event to display a notification pop-up that informs users the export finished and their data was saved.

Use the following example to display a notification after a successful export.

<!--Render PDF Viewer component-->
<ejs-pdfviewer id="pdfViewer"
               [serviceUrl]="service"
               [documentPath]="document"
               (exportSuccess)="fireExportRequestSuccess()"
               style="height:640px;display:block">
</ejs-pdfviewer>

//Method to notify popup once the form is submitted.
public fireExportRequestSuccess() {
  var pdfViewer = (<any>document.getElementById('pdfViewer'))
    .ej2_instances[0];
  //API to notify popup once the form is submitted.
  pdfViewer.viewerBase.openImportExportNotificationPopup(
    'Your form information has been saved. You can resume it at any time.Form Information Saved'
  );
}
<!--Render PDF Viewer component-->
<ejs-pdfviewer id="pdfViewer"
               [serviceUrl]="service"
               [documentPath]="document"
               (exportSuccess)="fireExportRequestSuccess()"
               style="height:640px;display:block">
</ejs-pdfviewer>

//Method to notify popup once the form is submitted.
public fireExportRequestSuccess() {
  var pdfViewer = (<any>document.getElementById('pdfViewer'))
    .ej2_instances[0];
  //API to notify popup once the form is submitted.
  pdfViewer.viewerBase.openImportExportNotificationPopup(
    'Your form information has been saved. You can resume it at any time.Form Information Saved'
  );
}

View sample in GitHub.