Stig Perez
Stig Perez

Reputation: 3833

How to change the alt text on input validation

I have a very simple form with an input field and a submit button:

<form action="#">
    <input type="number" min="1" /> <input type="submit" name="submit" />
</form>

When typing in "0" in the input field and submitting the form, a validation error message is displayed. I also noticed the alt-text is set to the same validation message when I hover over the invalid input field. Is it possible to change the alt-text and how do you do it?

Upvotes: 1

Views: 1246

Answers (2)

M.Pushkov
M.Pushkov

Reputation: 1

The HTML5 constraint validation API might be a better solution, as in Chrome, at least, changing "title" attribute does not chage the error message entirely, but partly. You can use setCustomValidity() method like that

<form action="#">
   <input id="num" type="number" min="1" /> <input type="submit" name="submit" />
</form>

document.getElementById('num').setCustomValidity('your full message text here')

Upvotes: 0

raphael75
raphael75

Reputation: 3238

You can add an id to the element to make it easy to refer to in the javascript:

<form action="#">
    <input id="num" type="number" min="1" /> <input type="submit" name="submit" />
</form>

document.getElementById('num').alt = 'your text here'
document.getElementById('num').title = 'your text here'

It might also be useful to set the title (popup text) in addition to the alt text (text displayed if the image can't be loaded).

Upvotes: 3

Related Questions