ngOfficeUIFabric / ng-officeuifabric

Office UI Fabric (https://github.com/OfficeDev/office-ui-fabric) implementation for Angular
http://ngOfficeUiFabric.com
MIT License
321 stars 68 forks source link

Editable datepicker #502

Open angex opened 7 years ago

angex commented 7 years ago

Is there an option to set uif-datepicker editable?

andrewconnell commented 7 years ago

Not sure I know what you mean... all controls by their nature are usable / editable.

angex commented 7 years ago

I mean typing in the date with keyboard. Keyboard input is disabled and I don't find option for enabling it for this control.

andrewconnell commented 7 years ago

Unfortunately not... Office UI Fabric took a dependency on http://amsul.ca/pickadate.js/ to implement this control which applies to us as well. Doesn't appear it supports manually entering the date so unfortunately, we can't do that at this time.

angex commented 7 years ago

amsul has editable: true This prevents popup from opening but it can be overridden: https://github.com/amsul/pickadate.js/issues/542

andrewconnell commented 7 years ago

I stand corrected... warrants additional research to see if this is supported as the issue on their repo is open and only resolved by a fork... which we aren't based on... so not sure if the underlying version of the library supports it.

architshukla commented 7 years ago

It seems to be supported by the library and there is an example at http://amsul.ca/pickadate.js/date/#editable. I've also checked that setting editable: true in the existing directive prevents the picker from launching.

The change would require conditionally applying a change/focusout listener on the input field. I can prepare a PR for this if no one else is working on it.

As my local changes stand at this moment, I am converting the input value to a Date and this means an empty or invalid date returns the current date. Let me know if this is not acceptable and we can discuss alternatives.