CODEWITHSUNDEEP
javascriptjqueryvalidation
Lokomotywa
Lokomotywa

Reputation: 2844

make hidden input field considered 'valid'

Why is a hidden input not considerd 'valid' by the jquery selector and what can I do about that (i.e. to make it valid).

console.log($("#a").is(":valid")); // true
console.log($("#b").is(":valid")); // false
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="a" type="text" value="abc">
<input id="b" type="hidden" value="def">

Upvotes: 0

Views: 55

Answers (2)

DereckChamboko
DereckChamboko

Reputation: 287

console.log($("#a").is(":valid")); // true
console.log($("#b").is(":valid")); // false
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="a" type="text" value="abc">
<input id="b" type="text" style="display:none" value="def">

Change type from hidden to text, then use CSS to change the display property to none

Upvotes: 1

msg
msg

Reputation: 8171

As per the MDN:

Hidden inputs don't participate in constraint validation; they have no real value to be constrained.

And as such will not receive any valid or invalid pseudoclasses. A couple of options come to mind, either filter the collection to exclude hidden inputs or use this check as a workaround:

$("#b").is(":not(:invalid)");

Upvotes: 2

Related Questions