How to reset last value when giberrish entered in v6?

[amaneja]

I was using Bootstrap 3 with eonasdan date time picker. Somehow managed to implement the tempusDominus with Bootstrap 5 using the below code and it is working fine. But..

const td = new tempusDominus.TempusDominus(
  document.getElementById('datetimepicker1'),
  {
    display: {
      viewMode: 'calendar',
      components: {
        decades: true,
        year: true,
        month: true,
        date: true,
        hours: false,
        minutes: false,
        seconds: false,
        
      },
      theme: 'light',
    },
    useCurrent: false,  
    localization: {
      startOfTheWeek: 1
    }
  }
);

td.dates.formatInput = function (date) {
  return moment(date).format('DD/MM/YYYY');
};

td.dates.setFromInput(new Date());

.. when I enter something random, let's say 'abcd' and leave the picker. It doesn't validate/reset the field to last value.

Please help.

[Eonasdan]

Hi. Sorry for the very long delay. I lost sight of this discussion. There's nothing currently that supports this out of the box. You could probably implement something custom like checking for an error event.

[amaneja]

Thanks a lot for the response. It worked beautifully in the older version though.

I'll try to find an alternative. Tempus Dominus is really great @Eonasdan. Keep up the great work!

[Eonasdan]

Thanks for the kind words.

I just created #2705 that might be of interest. I think I'd like to create a plugin that integrates with a input mask library. This would help keep users from enter none date values.

I think previously there was a big debate around whether or not to unexpectedly change a value a user provided. If the dp had 11/3/22 in it (either as a default or user input) -> user types in asdf which obviously isn't valid -> user tabs off -> dp is reset to 11/3/22 -> user submits form. Now the data is not what was expected. Its easier to see this as an issue if you think about date formats. 11/3/22 means November 3rd to me but friends across the pond view that as March 11th. If your site is expect a GB standard format and I provide a US format 11/20/22 and the dp auto sets it back to the previous value, that change could be lost.

I know it's less convenient for the dp not to handle this, however it keeps me from making assumptions about what your app and your users are expecting to happen.

Hope that makes sense.

[amaneja]

I completely agree with you, Jonathan! I have subscribed to #2705 and will keep an eye.

[stefano-1973]

I think that would be a start to be able to catch/avoid the browser exception (see #2755) so the final library user can decide what to do with the input field value
Thank you

[JanKrajewskiIT]

Try this

	const dateTimeFromInput = document.getElementById( ... );
	const dateTimeFrom = new tempusDominus.TempusDominus( dateTimeFromInput, ... );

	dateTimeFrom.subscribe(tempusDominus.Namespace.events.error, (e) => {
		let value = new tempusDominus.DateTime(e.value);
		if (value == 'Invalid Date') {
			value = dateTimeFrom.optionsStore._viewDate;
		}
		dateTimeFrom.dates.setValue(value);
	});