# How can I edit the annotation feature to accept multiple date input types?

**URL:** <https://pdfjs.community/t/how-can-i-edit-the-annotation-feature-to-accept-multiple-date-input-types/934>\
**Category:** Technical Support\
**Created:** [August 5, 2021, 3:18pm UTC](https://pdfjs.community/t/how-can-i-edit-the-annotation-feature-to-accept-multiple-date-input-types/934 "2021-08-05T15:18:21Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![tony1](https://avatars.discourse-cdn.com/v4/letter/t/858c86/32.png) [@tony1](https://pdfjs.community/u/tony1)\
**Post date:** [August 5, 2021, 3:18pm UTC](https://pdfjs.community/t/how-can-i-edit-the-annotation-feature-to-accept-multiple-date-input-types/934/1 "2021-08-05T15:18:21Z")

</div>

**Detailed description of question**

I want to create a tool where ‘data annotators’ see the PDF document at the left side of the screen and a pane on the right side with data based on the highlighted/annotated data from the left PDF view. So on the left side, you can highlight text, and then on the right side add additional data complementing that highlighted text in the annotations. I think this can be achieved with the annotation/marking and the commenting feature.

Currently, the Annotate feature lets the user add text after highlighting it in the PDF document (see the screenshot). I also want to add dropdowns and more text input fields.

 ![Screenshot 2021-08-05 at 17.11.57](https://canada1.discourse-cdn.com/flex031/uploads/pdfjscommunity/original/1X/cf59bca8135f0748601901c836ed9358a8b6a9c1.png)

Is this possible?

Thank you!

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex031/uploads/pdfjscommunity/original/1X/ffbcd25c7d423db8d5acd5db201c272f4db306dd.png) [@system](https://pdfjs.community/u/system)\
**Post date:** [August 5, 2021, 3:18pm UTC](https://pdfjs.community/t/how-can-i-edit-the-annotation-feature-to-accept-multiple-date-input-types/934/2 "2021-08-05T15:18:26Z")

</div>

**Hello, I’m Ron, an automated tech support bot 🤖**

While you wait for one of our customer support representatives to get back to you, please check out some of these documentation pages:

Guides:
- [PDF.js Express Viewer](https://pdfjs.express/documentation/viewer/overview)
- [File format support for PDF.js Express](https://pdfjs.express/documentation/learn-more/file-format-support)
- [Understand coordinates in PDF.js Express - Viewer page coordinates](https://pdfjs.express/documentation/viewer/coordinates#viewer-page-coordinates)

APIs:
- [Tools.TextHighlightCreateTool - mouseLeftUp(e)](https://pdfjs.express/api/Tools.TextHighlightCreateTool.html#mouseLeftUp__anchor)
- [Tools.TextSquigglyCreateTool - mouseLeftUp(e)](https://pdfjs.express/api/Tools.TextSquigglyCreateTool.html#mouseLeftUp__anchor)
- [Tools.TextUnderlineCreateTool - mouseLeftUp(e)](https://pdfjs.express/api/Tools.TextUnderlineCreateTool.html#mouseLeftUp__anchor)

Forums:
- [How can we create our custom thumbnail panel beside our viewer?](https://pdfjs.community/t/how-can-we-create-our-custom-thumbnail-panel-beside-our-viewer/811/1)
- [Customize print options](https://pdfjs.community/t/customize-print-options/490/1)
- [Issue with importing radio buttons in pdf](https://pdfjs.community/t/issue-with-importing-radio-buttons-in-pdf/821/1)

---

<div class="post-metadata">

**Author:** ![Logan](https://yyz1.discourse-cdn.com/flex031/user_avatar/pdfjs.community/logan/32/13_2.png) [@Logan](https://pdfjs.community/u/Logan)\
**Post date:** [August 6, 2021, 7:59pm UTC](https://pdfjs.community/t/how-can-i-edit-the-annotation-feature-to-accept-multiple-date-input-types/934/3 "2021-08-06T19:59:29Z")

</div>

Hey there,

We have [an api](https://pdfjs.express/api/WebViewerInstance.html#dangerouslySetNoteTransformFunction__anchor) that allows you to alter what is rendered in each note in the right panel.

Please be aware that this function is only really recommended for small tweaks, so use it sparingly as it can cause weird issues.

If you don’t want to use that approach, our UI is actually [open source](https://github.com/PDFTron/webviewer-ui) and you can fork and edit the source code to include whatever functionality you want. [Here is a guide](https://pdfjs.express/documentation/ui-customization/advanced-customization) on doing so.

Thanks!  
Logan

---

<div class="post-metadata">

**Author:** ![tony1](https://avatars.discourse-cdn.com/v4/letter/t/858c86/32.png) [@tony1](https://pdfjs.community/u/tony1)\
**Post date:** [August 9, 2021, 9:32am UTC](https://pdfjs.community/t/how-can-i-edit-the-annotation-feature-to-accept-multiple-date-input-types/934/4 "2021-08-09T09:32:55Z")

</div>

Hi Logan,

Thank you very much! This sounds very interesting.

Can you help me by pointing me in the direction where in the code the part for the annotations is?

Thanks!

---

<div class="post-metadata">

**Author:** ![Logan](https://yyz1.discourse-cdn.com/flex031/user_avatar/pdfjs.community/logan/32/13_2.png) [@Logan](https://pdfjs.community/u/Logan)\
**Post date:** [August 10, 2021, 2:20pm UTC](https://pdfjs.community/t/how-can-i-edit-the-annotation-feature-to-accept-multiple-date-input-types/934/5 "2021-08-10T14:20:06Z")

</div>

Hey!

I would start looking at the [`Note`](https://github.com/PDFTron/webviewer-ui/tree/8.0/src/components/Note) component.

Note that the UI is in 8.0 - if you are using version 7.X of Express please make sure to switch to the 7.3 branch.
