Angular: Empty Fiddle

http://angularjs.org/

by Shidhin C R

HTML

<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<div ng-controller="MyCtrl">
    <div class='message' ng-hide="!message">{{message}}</div>
    <form name="form1" ng-submit="save()">
        <input type="number" ng-model="model.data1" required />
        <input type="number" ng-model="model.data2"/>
        <button type="submit" ng-disabled="form1.$invalid">Save</button>
    </form>
</div>

CSS

input:invalid {
    background-color: #f0dddd;
}
.message {
    padding: 5px;
    border: 1px solid green;
    background-color: lightgreen;
}

JavaScript

var myApp = angular.module('myApp', []);


function MyCtrl($scope,$timeout) {
    $scope.model = {
        data1: 14,
        data2: 15
    };
    $scope.save = function(){
        $scope.message = "Form saved successfully";
        $timeout(function(){
            $scope.message = '';
            $scope.$apply();
        },2000);
    }
}