Schimbare mesaj pentru inputurile cu required

Salutare,

Pentru inputurile care au ca atribut required cum pot schimba mesajul standard oferit de browser?

Multumesc!

setCustomValidity

2 Likes

Am acest script:

<input type="date" id="data" required onchange="dataActiv()">

<script>
    function dataActiv() {
    	var inputDate = document.getElementById('data');
        var selDate = new Date(document.getElementById('data').value);

        if (selDate <= new Date()){
            console.log('nu poti selecta o data mai mica decat data curenta');
            inputDate.value = ''";
        }
    }

</script>

In codul de mai sus, in if cum pot sa modific mesajul required cu cel care este setat sa apara in consola?

Ți-a dat @victorelu link mai sus:

selectElt.setCustomValidity(string);

Inainte sa postez am gasit acel link, am incercat sub forma aceasta inputDate.setCustomValidity(‘test’); insa fara efect.

  1. Vezi ca ai typo in inputDate.value = ''"
  2. Tu ai cerut pentru required, dar ceea ce incerci sa faci nu face trigger la validarea respectiva. Din cate stiu, validarea de required se face pe form submit (previne submitul daca da eroare si afiseaza mesajul)
1 Like

Frumos, elegant, fara batai de cap.
In felul asta, optimizezi si timpul clientului.

<input type="date" id="input-date" name="date" required>

<script>
	let today = new Date().toISOString().substr(0, 10);
	document.getElementById("input-date").setAttribute("min", today);
</script>
5 Likes