Set oninvalid and oninput properties of input fields from jquery

Question

I want to use custom form validation for my input fields. I want to display a custom message and make borders red of input fields. The problem is that I am unable to do this in jQuery. For Html, I have found the following solution.

<form:input id="valid-to" required="required" type="text" class="custom-html-validation"
oninvalid="this.setCustomValidity('Enter User Name Here')"
oninput="this.setCustomValidity('')"/>

This oninvalid does work correctly and displays message when user submits the form. How can I use similar functionality in jQuery. I have tried the solution from jQuery validation: change default error message but it did not resolve my problem and I got Cannot read properties of undefined (reading 'messages') in browser console.

This was the solution in the link which I used stackoverflow.com/questions/2457032/…) — Eatsam ul haq
– Eatsam ul haq, Commented Oct 28, 2022 at 11:40
Cannot read properties of undefined means that you made a critical mistake with how you constructed your methods, called your methods, or included your scripts. Misspelling a rule or calling a rule that does not exist can cause this error. Since you have not shown us how you came to this error, there is no way anyone could help you solve it. Show us the working example of your code that reproduces the error. — Sparky
– Sparky, Commented Oct 28, 2022 at 17:29

Eatsam ul haq · Accepted Answer · 2022-10-28 12:21:22Z

-1

After some research, I found the following solution:

$(document).on('focus', '.custom-html-validation', function(){
    $(this).get(0).setCustomValidity('Please enter valid information');
})

The above code shows error message as Please enter valid information when submit button is clicked

answered Oct 28, 2022 at 12:21

Eatsam ul haq

3475 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Set oninvalid and oninput properties of input fields from jquery

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related