Date d'entrée Wont valeur de journal de la console

Question

J'essaie de voir quelle valeur mon champ de saisie de date a cependant je suis toujours à gauche avec null dans ma console.

J'utilise le JS suivant pour console.log ma valeur d'entrée de date:

document.getElementById('date_of_birth').addEventListener('change', function() { 
    console.log(this.getAttribute('value')); 
}); 

Voici mon champ d'entrée aussi:

<input id="date_of_birth" 
class="input input--bravo pad-1/2 span-1x field-date_of_birth is-invalid" 
data-palm="span-1x" 
placeholder="dd/mm/yyyy" 
pattern="\d{2}\/\d{2}\/\d{4}*" 
name="payload[date_of_birth]" 
type="date" _flx1_12_1="1" _flx1_13_1="1"> 

Lorsque je sélectionne une date mon JS déclenche imprime cependant nulle en la console. Pourquoi ne montre-t-il pas la date que j'ai choisie? Je veux seulement voir la date afin que je puisse voir comment la valeur est mise en forme afin que je puisse mettre en place une validation pour cela.

Merci, Nick

Answer 1

Essayez cette ...

getAttribute peuvent utiliser pour définies ou des propriétés personnalisées. Vous devez utiliser .value

document.getElementById('date_of_birth').addEventListener('change', function() { 
 
    console.log(this.value); 
 
});

<input id="date_of_birth" 
 
     class="input input--bravo pad-1/2 span-1x field-date_of_birth is-invalid" 
 
     data-palm="span-1x" 
 
     placeholder="dd/mm/yyyy" 
 
     pattern="\d{2}\/\d{2}\/\d{4}*" 
 
     name="payload[date_of_birth]" 
 
     type="date" _flx1_12_1="1" _flx1_13_1="1">

vous pouvez utiliser getAttribute dans ce cas ci-dessous.

document.getElementById('date_of_birth').addEventListener('change', function() { 
 
    console.log(this.getAttribute('value')); 
 
});

<input id="date_of_birth" 
 
     class="input input--bravo pad-1/2 span-1x field-date_of_birth is-invalid" 
 
     data-palm="span-1x" 
 
     placeholder="dd/mm/yyyy" 
 
     pattern="\d{2}\/\d{2}\/\d{4}*" 
 
     name="payload[date_of_birth]" 
 
     value="01/01/2016" 
 
     type="date" _flx1_12_1="1" _flx1_13_1="1">

Answer 2

Essayez avec console.log(this.value); au lieu de console.log(this.getAttribute('value'));

this.getAttribute va attraper le HTML attribuiez

Answer 3

document.getElementById('date_of_birth').addEventListener('change', function() { 
    console.log($('#date_of_birth').getDate()); 
}); 

Vous pouvez utiliser ci-dessus code pour obtenir date de cet élément HTML.

Answer 4

Vous pouvez:

document.getElementById('date_of_birth').addEventListener('change', function() { 
    console.log(this.value); 
}); 

OU

document.getElementById('date_of_birth').addEventListener('change', function() { 
    console.log(document.getElementById('date_of_birth').value); 
});