So I have been working on a big project recently and had to implement some sort of validation in a form. Looked around and tested many different solutions but most was to rigid for my application or relied on even more js-files to be piled on the system. After some searching and testing I found a solution at Formden (go there and check out the original code) that did what I wanted and nothing more and was easily adaptable.
The original code had text that was displayed informed the user of what was wrong and coloured the border in the "error place". I didn't need that, the mandatory fields had date/time pickers etc, so only the colour indicator and a final splash screen on submit (with "go back clumsy user!" 😉 ) was to be used. Seeing that I was running Bootstrap and it having a nice validation-indicator-design I mashed the two together! Oh and I adapted the script so you can choose which fields are to be validated at submit in the form (original validated the entire form), just add the class req to the input-field.
There is individual real-time validation functions for each unique input type, seen in this example is for Google Maps search box, jQuery UI datepicker and a time-picker. For more examples for validation of e-mail etc. check out the code at Formden.
I wont create a demo-file or complete code here, I assume that you can insert the Bootstrap, jQuery and jQuery UI scripts + css by yourself.