0

** Necesito mostrar mi fecha a partir que yo rellene el input date y los tres campos: Edad, Mes, Dias y mostrar cuandos años tiene la persona, meses y dias he intentado de varias manera pero no he podido dar con ello ** Necesito mostrar mi fecha en formato AAA-MM-DD javascript

Intente algo como lo el siguiente codigo que muestro a continuacion.

document.addEventListener(
    "DOMContentLoaded", e => {
        const
            d = document,
            $ = s => d.querySelector(s),
            $birthday = $("#birthday"),
            $year = $("#year"),
            $month = $("#month"),
            $day = $("#day");
        $birthday.placeholder = "YYYY/MM/DD"
        $birthday.oninput = function(e) {
            const content = this.value;
            if (content != "") {
                if (content.includes("/")) {
                    if (content.length == 10) {
                        if (content.indexOf("/") == 4) {
                            const [
                                year,
                                month,
                                day
                            ] = content.split("/");
                            const isNum = (...s) => !s.every(isNaN);
                            if (isNum(year, month, day)) {
                                $year.value = year;
                                $month.value = month;
                                $day.value = day;
                            }
                        }
                    }
                }
            }
        }
    }
)

1 respuesta 1

2

Creo que podrías intentar algo como lo siguiente: Primero estableces un id para cada input. Sabiendo que el campo que obtendrá la fecha completa debe venir en el siguiente formato YYYY/MM/DD, simplemente haces uso de la función split de javascript para obtener los datos, usando como separador slash (/), lo que dividirá tu string y lo convertirá en un array de 3 posiciones, luego dices que los valores de cada elemento (Año, Mes y Día), corresponden a posiciones específicas de tu array.

let birthday = document.getElementById('birthday');
let year = document.getElementById('year');
let month = document.getElementById('month');
let day = document.getElementById('day');

birthday.addEventListener('change', () => {
  let fecha = birthday.value.split('-');
  
  year.value = fecha[0];
  month.value = fecha[1] || '';
  day.value = fecha[2] || '';
})
input {
  height: 2rem;
  width: 25%;
}
<div id="app">
  <input id="birthday" type="date" placeholder="YYYY/MM/DD">
  <input id="year" type="text" placeholder="Year">
  <input id="month" type="text" placeholder="Month">
  <input id="day" type="text" placeholder="Day">
</div>

2
  • Excelente, y como seria con un input type date? Asi es que lo necesito Commented el 21 jun. 2021 a las 13:57
  • Es básicamente lo mismo, es decir, sabes que un input type date no devuelve la fecha con slash (/) sino guiónes (-), entonces en vez de hacer un split con slash, lo haces con guiónes para que tome los valores. Igualmente edité el script para que pruebes el resultado con un input de tipo date
    – gaidyjg
    Commented el 21 jun. 2021 a las 14:13

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.