{% extends "base.html" %}

{% block title %}Add Baby Form{% endblock %}

{% block head %}
    <script type="text/javascript">
        angular.module('baby-add', ['djng.forms']).config(function($httpProvider) {
            $httpProvider.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
            $httpProvider.defaults.headers.common['X-CSRFToken'] = '{{ csrf_token }}';
        });
        angular.module('baby-add').controller('BabyNewForm', ['$scope', '$http', '$window', 'djangoForm',
                                            function($scope, $http, $window, djangoForm) {
        $scope.submit = function() {
            if ($scope.subscribe_data) {
                $http.post(".", $scope.subscribe_data).then(function(response) {
                    if (!djangoForm.setErrors($scope.my_form, response.data.errors)) {
                        // on successful post, redirect onto success page
                        $window.location.href = response.data.success_url;
                    }
                }, function() {
                    console.error('An error occurred during submission');
                });
            }
            return false;
        };
    }]);
    </script>
{% endblock %}

{% block content %}
    <form name="{{ form.form_name }}" method="post" action="." novalidate ng-controller="BabyNewForm">
        {% csrf_token %}
        {{ form.as_div }}
        <button type="submit" ng-disabled="{{ form.form_name }}.$invalid" class="btn btn-primary">Submit via Post</button>
        <button type="button" ng-disabled="{{ form.form_name }}.$invalid" ng-click="submit()" class="btn btn-primary">Submit via Ajax</button>
    </form>
{% endblock %}