Birthday

Example of how to display birthdays & open a form in same view

by enigmarm

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<div ng-controller="bdayCtrl">
    <h3>Birthday Reminders</h3>
    <table border="1">
        <tr ng-repeat="bday in bdays">
            <td>{{bday.name}}</td>
            <td>{{bday.date}}</td>
        </tr>
    </table>

<a class="btn" ng-click="visible = true">Add new</a><br>

<form class="form-horizontal" ng-show="visible" ng-submit="newDate()">
        <input type="text" ng-model="bdayname" placeholder="Name"><br>
        <input type="text" ng-model="bdaydate" placeholder="Birthdate">
        <button class="btn" type="submit"><i class="icon-plus"></i>Add</button>
</form>
</div>

JavaScript

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

function bdayCtrl($scope) {
    $scope.bdays = [{
            "name": "Jamal",
            "date": "Jan 1, 1980"
    }, {
            "name": "Paula",
            "date": "Jan 1, 2000"
    }, {
            "name": "Damon",
            "date": "Jun 30, 1800"
    }];

    $scope.newDate = function () {
        $scope.bdays.push({name:$scope.bdayname, date:$scope.bdaydate});
        $scope.bdayname = '';
        $scope.bdaydate = '';
    };
}