Validate Date In Timeline Report Custom Events

[tubbo]

Ensure the hidden input storing the value for the dateTimePicker is
:required, which prevents the form from saving. This value is also
passed down into the template UI created by the JS module in order to
make sure the user gets some visual feedback.

[bencrouse]

So we still need a way to display something, yeah? Is that why this is a draft PR?

[tubbo]

That would definitely be better than showing nothing, gonna spend some time on it today.

[tubbo]

I modified the dateTimePicker module to pass the required attribute from the hidden input into the visual fields created by the datepicker. This at least shows some visual feedback for when a date is required on a given form, although I think the UI can still be somewhat improved, but that's not really something we should be doing in a patch IMO.

[tubbo]

One issue I'm having here is initially clicking the "+ Add Custom" button will produce this UI, which indicates that the field hasn't been filled in. Notice how the "Name" field doesn't have that red border? I'm a bit perplexed by why this is happening, since the required attribute is only supposed to take effect after a form submission, and it doesn't seem like the form is being submitted yet..

[bencrouse]

The code looks good, seems like it has to do with the input being focused for some reason?

[tubbo]

@bencrouse I don't think that's it. When trying to manually focus() a different element, the border still appeared. The only difference between the two .text-box elements in that tooltip are that one (the "Name" field, which looks OK) is rendered by the server and the other (the "Date" field, with the issue) is rendered by a JST.

[tubbo]

lol, I didn't bother to check it in other browsers...this is a firefox-only bug it seems, I'm gonna see if its reported and if so, report it, but otherwise it's not relevant for this ticket.