# Custom date format for DatePickerWidgetAnnotation

**URL:** <https://pdfjs.community/t/custom-date-format-for-datepickerwidgetannotation/587>\
**Category:** Technical Support\
**Created:** [March 9, 2021, 5:14am UTC](https://pdfjs.community/t/custom-date-format-for-datepickerwidgetannotation/587 "2021-03-09T05:14:18Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![fuse](https://avatars.discourse-cdn.com/v4/letter/f/8e8cbc/32.png) [@fuse](https://pdfjs.community/u/fuse)\
**Post date:** [March 9, 2021, 5:14am UTC](https://pdfjs.community/t/custom-date-format-for-datepickerwidgetannotation/587/1 "2021-03-09T05:14:18Z")

</div>

Hi there,

I am using the [DatePickerWidgetAnnotation](https://pdfjs.express/api/Annotations.DatePickerWidgetAnnotation.html) to allow users to fill a date into a PDF form. I am wondering how I can change the date format from the current `mm/dd/yy` - specifically I need `yyyy-mm-dd`.

Thanks, Luke.

---

<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:** [March 9, 2021, 5:29pm UTC](https://pdfjs.community/t/custom-date-format-for-datepickerwidgetannotation/587/2 "2021-03-09T17:29:37Z")

</div>

Hey there,

Are you creating the DatePicker programmatically? Or is it already part of the document?

Thanks,  
Logan

---

<div class="post-metadata">

**Author:** ![fuse](https://avatars.discourse-cdn.com/v4/letter/f/8e8cbc/32.png) [@fuse](https://pdfjs.community/u/fuse)\
**Post date:** [March 9, 2021, 10:41pm UTC](https://pdfjs.community/t/custom-date-format-for-datepickerwidgetannotation/587/3 "2021-03-09T22:41:59Z")

</div>

Hi,

I am creating them programmatically, roughly like this:

```javascript
const field = new Annotations.Forms.Field(fieldItem.Id, {
    value: fieldItem.Value // some value
});
const annot = new Annotations.DatePickerWidgetAnnotation(field);

// ... apply page/width/height/x/y here ...

 annotManager.addAnnotation(annot);
 annotManager.redrawAnnotation(annot);

```

Cheers, Luke.

---

<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:** [March 12, 2021, 7:31pm UTC](https://pdfjs.community/t/custom-date-format-for-datepickerwidgetannotation/587/4 "2021-03-12T19:31:41Z")

</div>

Hey there!

When you’re creating the field, try using these settings (and update the date formats to your linking):

```javascript
const field = new Annotations.Forms.Field(
        'DatePicker',
        {
          type: 'Tx',
          value: '1.1.2004',
          // Actions need to be added for DatePickerWidgetAnnotation to recognize this field.
          actions: {
            F: [
              {
                name: 'JavaScript',
                // You can customize the date format here between the two double-quotation marks
                // or leave this blank to use the default format
                javascript: 'AFDate_KeystrokeEx("mmm d, yyyy");',
              },
            ],
            K: [
              {
                name: 'JavaScript',
                // You can customize the date format here between the two double-quotation marks
                // or leave this blank to use the default format
                javascript: 'AFDate_KeystrokeEx("mmm d, yyyy");',
              },
            ],
            
          },
        },
      );

```

Let me know if this doesn’t work for you.

---

<div class="post-metadata">

**Author:** ![fuse](https://avatars.discourse-cdn.com/v4/letter/f/8e8cbc/32.png) [@fuse](https://pdfjs.community/u/fuse)\
**Post date:** [March 17, 2021, 5:57am UTC](https://pdfjs.community/t/custom-date-format-for-datepickerwidgetannotation/587/5 "2021-03-17T05:57:49Z")

</div>

Thanks Logan, that has worked.

---

<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:** [March 17, 2021, 3:03pm UTC](https://pdfjs.community/t/custom-date-format-for-datepickerwidgetannotation/587/6 "2021-03-17T15:03:34Z")

</div>


