Custom Validity JQuery

Question

I have found tutorials which showing how to use javascript to set custom errors for a form's input fields. An example is as follows:

  document.getElementById('fname').setCustomValidity('Invalid'); 

However if i try to use jquery this does not seem to work. An example is as follows:

$('#fname').setCustomValidity('Invalid');

I prefer working with JQuery so can anyone tell me why this does not work and how i can possibly do the same in JQuery.

Answer 1

setCustomValidity is a native javascript method. Therefore, get a native javascript object and then call like

$('#fname').get(0).setCustomValidity('Invalid');

Update

so why is it i dont have to put .get(0) when i always use JQuery. can you explain get(0) if possible?

The issue is not whether you are using jQuery or not. Rather the issue is you are trying to call a native javascript function that doesnt exist for jQuery objects. That is why using get() will get you the native javascript DOM element that has access to the javascript function