Back

Technologies:

javascriptjavascript
avatar
Tolerim
2 hours ago

How can I use the Cleave.js pattern to format dates in the DD.MM.YYYY format?

Is it possible to add a trailing dot to the Cleave.js date pattern (DD.MM.YYYY) to make the input format valid with a dot at the end (e.g., 04.05.2023.)?

I suggest modifying the existing Cleave.js code to include a regular expression that adds the trailing dot to the end of the input. Below is an example:

new Cleave('.my-input', {
    date: true,
    datePattern: ['Y', 'm', 'd'],
    delimiter: '.'
}).on('change', function (event) {
  var formattedValue = event.target.value.replace(/(\d{2}\.\d{2}\.\d{4})/, '$1.');
  event.target.value = formattedValue;
});
The regular expression above looks for the pattern DD.MM.YYYY and adds a dot at the end, resulting in a valid input format. Hopefully, this helps address your query. Don't hesitate to reach out to me if you need further assistance.

Answers(1)
avatar
Tolerim
2 hours ago
Verified Answer
To add a trailing dot to the Cleave.js date pattern (DD.MM.YYYY.), you can modify the datePattern option in your Cleave.js code. Here's an example: 
new Cleave('.my-input', {
    date: true,
    datePattern: ['D', 'M', 'Y', '.'],
    delimiter: '.'
});
In this example, we have added a period (.) after the 'Y' parameter in the datePattern. This will output the date format as DD.MM.YYYY. with the final dot.
;