Comment ajouter des outils d'annotation, de rédaction et d'édition de formulaire à une visionneuse PDF JavaScript

À mesure que de plus en plus d'applications professionnelles migrent vers l'environnement Web, il est logique que des éléments tels que le partage et l'édition de documents soient également migrés vers le navigateur. Cependant, dans de nombreuses situations, les utilisateurs devront faire plus que simplement visualiser un document PDF.

Ils devront peut-être ajouter des annotations pour fournir des informations supplémentaires, supprimer des informations personnelles du document ou même remplir des champs de formulaire dans le document. Heureusement, la visionneuse PDF JavaScript de Document Solutions facilite l'ajout de cette fonctionnalité à votre application JavaScript .

Dans cet article, nous allons passer en revue les fonctionnalités suivantes de la visionneuse PDF JavaScript de Document Solutions :

• Éditeur d'annotations pour la visionneuse PDF JavaScript

• Principales fonctionnalités des annotations

• Rédiger le contenu d'un PDF

• Éditeur de formulaires pour la visionneuse PDF JavaScript

• Principales fonctionnalités de l'éditeur de formulaire

• Options d'édition supplémentaires pour la visionneuse PDF

  
  

Jetons maintenant un coup d'œil à ces fonctionnalités.

Éditeur d'annotations pour la visionneuse PDF JavaScript

Les outils d'annotation de Document Solutions JavaScript PDF Viewer aideront les utilisateurs à réviser et à marquer les informations importantes dans leurs documents PDF. Ils pourront également ajouter, modifier et supprimer des annotations sur des documents PDF existants tout en préservant le contenu original.

Les utilisateurs peuvent dessiner des annotations sur le PDF, commenter et répondre aux commentaires des autres. Grâce à la possibilité de masquer les annotations, les utilisateurs peuvent facilement visualiser et imprimer les documents originaux et, s'ils en ont besoin, ils peuvent également imprimer des copies contenant leurs annotations. L' éditeur d'annotations répertorie toutes les annotations de votre document, ce qui vous permet d'accéder et de modifier les annotations existantes :

Cas d'utilisation et avantages

En règle générale, les utilisateurs s'appuient sur Adobe Acrobat pour annoter les PDF. Avec une visionneuse incluant des fonctionnalités d'édition, vos utilisateurs peuvent annoter leurs documents directement dans l'application sans avoir à passer d'une application à l'autre. Comme vous pouvez le constater, une visionneuse dotée de fonctionnalités d'édition peut considérablement rationaliser le flux de travail d'une entreprise.

Voici quelques exemples où cette fonctionnalité serait bénéfique :

• Un employé d'une entreprise souhaite envoyer des rapports financiers à la direction pour examen. La direction peut ouvrir les rapports en ligne dans la visionneuse PDF, utiliser des annotations pour suggérer des modifications et informer l'employé que des commentaires ont été formulés. Le collaborateur peut alors ouvrir le document dans l'éditeur en ligne et le mettre à jour dans le visualiseur à l'aide des annotations effectuées.

• Un salarié a des doutes sur la structure salariale de son entreprise. Ils peuvent lire les documents dans la visionneuse PDF, rédiger des informations confidentielles et marquer les zones nécessitant des éclaircissements grâce à des outils d'annotation.

• Un concepteur de site Web prépare des captures d'écran pour un site Web et les combine dans un PDF à envoyer pour révision. Les réviseurs marquent les zones qui nécessitent des modifications à l'aide des outils d'annotation.

  
  

Les outils d'annotation de Document Solutions JavaScript PDF Viewer rendent tous ces scénarios possibles. Examinons les fonctionnalités incluses dans Annotations.

Principales fonctionnalités des annotations

Les fonctionnalités clés suivantes sont disponibles avec les annotations :

• Modifiez des PDF avec une gamme d'annotations
• Marquez les informations importantes via une interface utilisateur conviviale
• Ajouter, modifier et supprimer des annotations de fichiers PDF nouveaux et existants
• Améliorez le contenu PDF et appliquez des propriétés spécifiques aux annotations
• Imprimer le PDF original sans modifications
• Enregistrez le PDF modifié avec les annotations sur le client

Modifiez des PDF avec une gamme d'annotations

La visionneuse PDF de Document Solutions prend en charge toutes les annotations dont vous avez besoin pour réviser vos documents PDF. Vous pouvez ajouter les éléments suivants :

• Annotations de texte (post-it) - Ajoute du texte ou des notes autocollantes sur le PDF
• Annotation de texte libre - Ajoute une note toujours visible sur le PDF
• Annotation à l'encre - Dessine des gribouillages à main levée sur le PDF
• Annotation carrée - Ajoute une forme rectangle/carré sur le PDF
• Annotation de cercle - Ajoute une forme de cercle sur le PDF
• Annotation de ligne - Ajoute une ligne droite sur le PDF
• Annotation polyligne - Ajoute des formes fermées ou ouvertes avec plusieurs bords sur le PDF
• Annotation de polygone - Ajoute un polygone sur le PDF
• Annotation des pièces jointes - Joindre un fichier au document, qui sera intégré dans le PDF
• Annotation sonore : ajoute du son (format .au, .aiff ou .wav) importé à partir d'un fichier ou enregistré à partir du microphone de l'ordinateur.
• Annotation de lien : ajoute des liens pouvant renvoyer vers différentes pages Web, appeler des moteurs de recherche et exécuter du JavaScript.
• Annotation de tampon - Utilisez des images, localement ou à partir d'un serveur, comme annotations sur le PDF

Marquez les informations importantes via une interface utilisateur conviviale

Les outils d'annotation PDF Viewer de Document Solutions disposent d'une interface utilisateur intuitive qui permet aux utilisateurs de dessiner des annotations sur le PDF. La visionneuse PDF comprend une barre d'outils d'annotation et un éditeur distincts pour ajouter des annotations, modifier leurs propriétés ou supprimer des annotations du PDF existant.

Le panneau Propriété affiche une liste d'annotations dans votre document. Vous pouvez sélectionner n'importe quelle annotation sur le PDF, appliquer des propriétés spécifiques à l'annotation à partir du panneau de gauche ou supprimer l'annotation.

Dans l'onglet Page du panneau, vous pouvez voir combien d'annotations existent sur votre page. Lorsque vous envoyez votre document pour révision, vous pouvez identifier le nombre de modifications apportées.

Ajouter, modifier et supprimer des annotations de fichiers PDF nouveaux et existants

Vous pouvez modifier les annotations existantes ou les supprimer à tout moment lors de la révision des PDF dans la visionneuse PDF JavaScript. Pour ajouter une annotation, cliquez simplement sur le bouton Éditeur d'annotations dans le panneau de gauche et vous verrez la barre d'outils d'annotation . Cliquez sur n'importe quelle annotation et dessinez directement sur le PDF. Sélectionnez l'annotation et vous verrez les propriétés de l'annotation affichées dans le panneau de gauche. Vous pouvez également charger un PDF avec des annotations existantes, sélectionner l'annotation, modifier les propriétés ou supprimer l'annotation du panneau des propriétés.

Améliorez le contenu PDF et appliquez des propriétés spécifiques aux annotations

Les utilisateurs bénéficieront d'une prise en charge étendue pour définir des propriétés spécifiques aux annotations dans la visionneuse. Vous pouvez ajouter du texte enrichi, définir la couleur du texte, ajouter une bordure, définir l'auteur et le sujet, ajouter une réponse, définir la position Limites/X/Y pour les annotations et bien plus encore à partir du panneau Propriétés.

Imprimer le PDF sans modifications

Si vous souhaitez afficher le PDF original, vous pouvez masquer les annotations à l'aide du bouton Masquer et imprimer le PDF sans annotations.

Enregistrez le PDF modifié avec les annotations sur le client

Cliquez sur le bouton Enregistrer pour appliquer les modifications à votre PDF et enregistrer les annotations. La visionneuse doit être connectée à un serveur exécutant DsPdf pour enregistrer les modifications. La liste des modifications et le PDF original sont envoyés au serveur, où DsPdf applique les modifications. Ensuite, il renvoie le PDF modifié au client, où l'utilisateur peut l'enregistrer.

Rédiger le contenu d'un PDF

L’option Supprimer une annotation ou Rédiger une région dans la barre d’outils vous aide à marquer les sections confidentielles à supprimer. Vous pouvez définir la couleur de bordure de marque et la couleur de remplissage de marque pour permettre aux utilisateurs de marquer la zone à rédiger. L'utilisateur peut définir ces propriétés à appliquer lors du survol du contenu rédigé, c'est-à-dire les propriétés Overlay Fill Color , Overlay Text , Overlay Text Align et Repeat Text . Toutes ces options apparaîtront dans votre PDF lorsque le contenu sera supprimé du document.

Vous pouvez également rédiger du contenu spécifique à partir du bouton Appliquer la rédaction dans le panneau Propriétés. Une fois la rédaction appliquée, vous pouvez la réinitialiser à l'aide du bouton Réinitialiser la rédaction dans la barre d'outils. Cependant, lors de l'enregistrement du PDF, les informations expurgées ne sont plus accessibles et les expurgations appliquées ne peuvent pas être réinitialisées.

Vous pouvez appliquer des annotations de rédaction individuelles ou cliquer sur le bouton Appliquer toutes les rédactions pour appliquer les rédactions dans l'ensemble du document. Lorsque vous enregistrez le PDF avec les expurgations appliquées, le contenu expurgé sera entièrement supprimé du PDF. Les utilisateurs ne peuvent pas sélectionner ou copier le matériel supprimé dans un autre document ni utiliser d'autres outils PDF pour lire le contenu rédigé.

Éditeur de formulaires pour la visionneuse PDF JavaScript

Avec l'éditeur de formulaires, vous pouvez désormais concevoir des formulaires PDF interactifs en ligne. L'éditeur vous aidera à utiliser divers champs de formulaire et propriétés avancées lors de la création de vos formulaires. Vous pouvez également remplir et soumettre le formulaire en ligne .

Les fonctionnalités de l'éditeur de formulaire incluent :

• Créez de nouveaux formulaires PDF à partir de zéro
• Concevoir, remplir, soumettre et réinitialiser des formulaires PDF
• Collectez les données directement auprès de l'utilisateur et remplissez les formulaires PDF
• Remplissez les données dans les champs du formulaire à partir d'une source externe (base de données, JSON , etc.)
• Ajouter des champs de formulaire aux documents PDF existants
• Modifier les champs de formulaire dans les documents PDF existants
• Ajouter la fonctionnalité JavaScript aux formulaires PDF
• Appliquer un large éventail de propriétés aux champs de formulaire
• Barre d'outils d'interface utilisateur rapide et intuitive et panneau de propriétés pour concevoir des formulaires PDF
• Créez une interface utilisateur personnalisée - omettez les champs inutiles dans votre barre d'outils

La nécessité d'un concepteur de formulaires PDF basé sur le Web

• Le format PDF est le format préféré pour la mise en page et l'apparence. Par conséquent, même si les formulaires HTML sont populaires, les formulaires PDF auront toujours l’apparence telle que vous les avez conçus.

• La plupart des applications sont basées sur le Web et Document Solutions PDF Viewer est un outil en ligne unique permettant de créer des formulaires PDF, de modifier des PDF, d'ajouter des annotations et d'enregistrer le PDF modifié sur le client. C'est un moyen plus rapide de générer et de conserver des PDF dans une seule application.

• Les développeurs peuvent créer un formulaire PDF dans Acrobat et le partager en ligne. Cependant, le PDF ouvert dans la visionneuse par défaut du navigateur ne peut pas être personnalisé et les développeurs ne peuvent pas non plus utiliser d'actions JavaScript supplémentaires sur le formulaire, comme soumettre le contenu ou remplir le contenu avec les données du formulaire. Document Solutions PDF Viewer prend en charge d'autres actions JavaScript que vous pouvez définir sur le formulaire avec les actions Soumettre et Réinitialiser.

• Vous pouvez utiliser Microsoft Word pour créer un formulaire ou utiliser un éditeur PDF. Créer un formulaire PDF dans Word peut s'avérer difficile car cela nécessite des outils d'édition complexes. Un concepteur de formulaires de visionneuse PDF Document Solutions est intuitif et comprend une interface utilisateur conviviale et le panneau Propriétés qui définit les propriétés souhaitées sur les champs du formulaire.

• Vous pouvez concevoir des formulaires PDF à afficher et à remplir sur n'importe quel navigateur. Vous n'avez pas non plus à vous soucier de son apparence ou de savoir si l'utilisateur final dispose d'Adobe Acrobat.

Différents types de formulaires PDF que vous pouvez créer

Vous pouvez créer les formulaires PDF suivants avec Form Designer :

• Formulaires d'inscription (exemples : événement, cours universitaires, adhésion, historique des patients, concours, etc.)

• Formulaires de candidature (exemples : demande d'emploi, demande de prêt, etc.)

• Formulaires de commentaires (exemples : événements, site Web, e-commerce, etc.)

• Formulaires de demande (exemples : location, renseignements, formulaires de paiement, etc.)

  
  

Principales fonctionnalités du concepteur de formulaires PDF

La visionneuse PDF JavaScript de Document Solutions prend en charge plusieurs types de champs de formulaire qui contribueront à rendre votre PDF interactif et complet :

• Champ de texte - Permet aux utilisateurs de saisir du texte tel que le nom, le numéro de téléphone, etc.
• Champ Mot de passe - Permet aux utilisateurs de saisir le mot de passe d'un document
• Champ de zone de texte - Vous permet d'ajouter un texte long tel que l'expérience professionnelle, l'adresse, etc.
• Champ CheckBox - Permet à votre utilisateur de sélectionner plusieurs options
• Champ ComboText - Vous permet d'ajouter du texte à des positions égales (par exemple, saisir la date, l'e-mail, etc. sur un formulaire d'inscription)
• Champ ComboBox - Vous permet de choisir un élément dans un menu contextuel ou de saisir une valeur
• Champ ListBox - Affiche une liste d'options de sélection
• Champ PushButton - Un bouton interactif qui déclenche des actions spécifiques, telles que l'ouverture de fichiers individuels, l'affichage d'un message contextuel, etc.
• Champ RadioButton - Affiche un groupe d'options parmi lesquelles l'utilisateur ne peut en sélectionner qu'une.
• Champ du bouton Soumettre - Vous permet de soumettre le formulaire rempli
• Champ du bouton de réinitialisation - Vous permet de réinitialiser le formulaire

Interface utilisateur conviviale pour concevoir des formulaires PDF

Les outils de l'éditeur de formulaires Document Solutions disposent d'une interface utilisateur conviviale pour ajouter des champs de formulaire au PDF. La visionneuse PDF comprend une barre d'outils et un éditeur de champs de formulaire distincts pour ajouter des champs de formulaire, modifier les propriétés ou les supprimer du PDF existant. Le panneau Propriété affiche une liste de champs de formulaire dans votre document. Vous pouvez sélectionner n'importe quel champ de formulaire sur le PDF, appliquer des propriétés spécifiques au champ de formulaire à partir du panneau de gauche et supprimer le champ de formulaire. Dans l'onglet Page du panneau, vous pouvez également voir combien de champs de formulaire existent sur votre page.

Ajouter, modifier et supprimer des champs de formulaire de formulaires PDF nouveaux ou existants

À tout moment, lors de la conception d'un formulaire PDF dans la visionneuse en ligne, vous pouvez modifier les champs de formulaire existants et également les supprimer. Pour ajouter un champ de formulaire, cliquez simplement sur le bouton Éditeur de formulaire dans le panneau de gauche et vous verrez la barre d'outils de l'éditeur de formulaire. Cliquez sur n'importe quel champ du formulaire et dessinez directement sur la page PDF. Sélectionnez le champ de formulaire et vous verrez les propriétés du champ de formulaire affichées dans le panneau de gauche. Vous pouvez également charger un formulaire PDF avec des champs de formulaire existants, sélectionner le champ de formulaire, appliquer des propriétés ou choisir l'option Supprimer dans le panneau des propriétés pour supprimer le champ de formulaire.

Améliorez le formulaire PDF avec des propriétés spécifiques aux champs du formulaire

Il existe une prise en charge étendue pour définir les propriétés spécifiques aux champs de formulaire pour chaque champ de formulaire pris en charge par la visionneuse. Parmi quelques fonctionnalités générales, vous pouvez définir le nom, la lecture seule, la valeur, l'alignement, la couleur du fond, la longueur maximale, les propriétés de bordure, la taille de la police et définir la position Limites/X/Y des champs du formulaire.

De plus, vous pouvez définir la propriété Required sur des champs de texte tels que TextField, PasswordField, TextArea et ComboText Field.

Imprimer le formulaire PDF original

Si vous souhaitez afficher le fichier PDF original, vous pouvez masquer les champs du formulaire à l'aide du bouton Masquer de la barre d'outils principale et afficher ou imprimer le fichier PDF sans les champs du formulaire.

Enregistrez le PDF nouvellement conçu avec les champs de formulaire sur le client

Appliquez les modifications à votre document PDF et enregistrez les champs du formulaire. Cette opération nécessite un produit DsPdf sur le serveur pour obtenir le PDF original et la liste des modifications, appliquer les modifications et renvoyer le PDF modifié au client.

Remplir et soumettre des formulaires PDF

Après avoir conçu le formulaire PDF, vous pouvez laisser vos utilisateurs remplir et soumettre le formulaire PDF au visualiseur. Les données du formulaire sont soit soumises à la base de données, soit générées au format PDF à partir des valeurs renseignées. Vous pouvez également importer des données de formulaire dans un formulaire PDF depuis la base de données vers la visionneuse.

Options d'édition supplémentaires pour la visionneuse PDF

Outre les annotations, les rédactions et les champs de formulaire, vous pouvez utiliser les fonctionnalités suivantes pour travailler et modifier des documents PDF.

Créer des documents PDF vierges

Il est possible d'utiliser PDF Viewer pour créer des documents PDF à l'aide du bouton Nouveau document . Vous pouvez concevoir le PDF ou un formulaire PDF via les outils Annotation et Form Editor .

Ajouter de nouvelles pages et supprimer des pages dans des documents PDF

Vous pouvez ajouter une nouvelle page à un document PDF existant ou à un document PDF original à l'aide du bouton Nouvelle page et utiliser le bouton Supprimer pour supprimer les pages.

Sélectionner et supprimer des annotations/champs de formulaire des documents PDF

Vous pouvez à tout moment sélectionner les champs d'annotation/formulaire ajoutés à un document PDF dans la vue Editeur d'annotations et Editeur de formulaire. Utilisez le bouton Supprimer pour supprimer les annotations ou les champs de formulaire des documents PDF nouveaux ou existants.

Annuler et rétablir les modifications

Si vous souhaitez annuler ou rétablir vos modifications apportées aux annotations ou aux champs de formulaire, vous pouvez utiliser les boutons Annuler/Rétablir dans l'éditeur d'annotations et de formulaire. Ces boutons enregistrent vos modifications progressivement et vous pouvez continuer à annuler ou refaire vos actions jusqu'à ce que vous soyez satisfait du résultat.

Conclusion

Avec cela, nous avons passé en revue les fonctionnalités d'annotations, de rédaction et de champs de formulaire de la visionneuse PDF JavaScript de Document Solutions. Comme vous l'avez vu, il ne pourrait pas être plus simple d'ajouter vos propres annotations, de rédiger des informations qui ne doivent pas être affichées et d'ajouter/modifier des champs de formulaire pour créer des formulaires PDF interactifs.