I've explored various solutions for this issue, but they all seem to be backend-focused. What I need is a Vue/JavaScript method. I have a string containing IDs, with the first 6 digits representing the date of birth and the final 4 digits being a personal identifier. For example, an ID will look like this: 211089-0000. So, the first 6 digits stand for DD/MM/YYYY.
I have two fields: one for entering the ID and the other for displaying the date of birth. I want the date of birth field to automatically update when an ID is entered, using the first 6 digits to convert them into a date format.
Here's how far I've progressed:
I've created a computed method like this:
updateDateOfBirth(){
if(!this.dateOfBirth && this.userId.length > 6){
this.dateOfBirth = this.userId.substring(0,6);
}
}
And I've added it as a change event in the userId input field:
<template>
<div>
<b-form-input v-model="userId" @change="updateDateOfBirth" placeholder="Enter your ID"></b-form-input>
<div class="mt-2">Value: {{ userId }}</div>
</div>
<div>
<b-form-datepicker id="dateOfBirth" v-model="dateOfBirth" class="mb-2"></b-form-datepicker>
<p>Value: '{{ dateOfBirth }}'</p>
</div>
</template>
Now, I need to convert the 5th and 6th digits into a year format, so 211089 becomes 21/10/1989. Can this be achieved using moment.js, perhaps? I haven't found any good examples yet.