nodep-date-input-polyfill icon indicating copy to clipboard operation
nodep-date-input-polyfill copied to clipboard

Run on dynamically added inputs before user clicks?

Open dartanian300 opened this issue 7 years ago • 5 comments

Currently, if a date field is added to the DOM with an existing value, the picker does not format the date until the user clicks on it. Since the picker requires the format of 'yyyy-MM-dd', the value jumps from that format to whatever the local version is (in my case it's MM/dd/yyyy). This is a bit confusing for users. Is there anyway to initialize the polyfill on elements before they're added to the DOM or immediately after?

I'm also using jQuery if that matters.

dartanian300 avatar Aug 22 '17 17:08 dartanian300

This isn't possible right now. It should be added, but in the meantime you'll need to change the display value yourself:

const val = input.value.split(`-`);
input.setAttribute(`value`, `${val[1]}/${val[2]}/${val[0]}`);

brianblakely avatar Aug 22 '17 18:08 brianblakely

@brianblakely is the input you're referring to a reference to the HTML input? If so, that seems to break the polyfill.

dartanian300 avatar Aug 22 '17 19:08 dartanian300

There must be something else happening; I tested this suggestion. Would you kindly send a demonstration of the issue?

brianblakely avatar Aug 23 '17 15:08 brianblakely

@brianblakely It appears to be working now. I was using jQuery to accomplish the same thing and I believe it was causing the issue. Using the exact fix you gave works great!

Sorry for the confusion.

dartanian300 avatar Aug 24 '17 12:08 dartanian300

Glad that worked! "Manual" usage will still land at some point.

brianblakely avatar Aug 24 '17 20:08 brianblakely