AngularJS Example

HTML

<div ng-app="">
    <form name="LovelyForm">
        <input type="number" name="LovelyNumber" ng-model="number" min="0" max="10" required/>
        <br>        
        <span ng-show="LovelyForm.LovelyNumber.$error.required">Show me your number</span> 
        <span ng-show="LovelyForm.LovelyNumber.$error.min">OMG, so min</span> 
        <span ng-show="LovelyForm.LovelyNumber.$error.max">OMG, too max</span> 
        <br>
        <input type="text" name="LovelyLove" placeholder="I Love U" ng-model="love" ng-pattern="/I love U too/" required/>        
        <span ng-show="LovelyForm.LovelyLove.$error.pattern">What?! Fucking buster!</span> 

    </form>
        <style>
            form.ng-valid {
                background-color:yellow;
            }
            form.ng-invalid {
                background-color:pink;
            }
            input.ng-valid {
                background-color: green;
            }  
            input.ng-invalid {
                 background-color: red;
             }
         </style>
</div>

CSS

</style> <!-- Ugly Hack due to jsFiddle issue: http://goo.gl/BUfGZ --> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
<style>