jQuery Validation in Real-Time

Question

I have an MVC page where in the view-model I've set up validation with some required attributes. In the page itself the validation is awesome. It literally fires the moment it detects the invalid state.

So in the example image I'm including

This message pops up the moment that text field is empty. What is triggering that? How can I tie my own custom validator into that? I have a custom validator that is based on an unusual condition that I cannot tie to a ViewModel attribute.

How can I inject HTML into the page using the ready function and attach a validator to a textbox and have that validator attach to the textbox so it behaves like the validators that come from the ViewModel attributes?

Here's an example of the ViewModel attributes that make this city validator work in realtime:

[Required]
[DisplayName("City")]
public string CityName { get; set; }

Thanks!

Answer 1

If you did not add any other custom validation jquery validation is detecting the errors.

@Scripts.Render("~/bundles/jqueryval")

You can remove it from page and add your own/custom validation. http://www.codeproject.com/Articles/275056/Custom-Client-Side-Validation-in-ASP-NET-MVC