{% extends "base.html" %}

{% block extra_javascript %}
<script type="text/javascript">
    $(document).ready(function() {
        $("#contact-form").submit(function(ev) {
            var form = $(this);
                mode = '{{ view.action }}';
            if (form.data('checked') == 'true' || mode != 'Création') return true;

            ev.preventDefault();
            var checkUrl = "{% url 'contact-doublon' %}";
            var postUrl = form.action;
            $.post(checkUrl, form.serialize(), function (data) {
                if (data) {
                    var resp = confirm("Un contact " + data[0].nom + " " + data[0].prenom + " existe déjà!\nVoulez-vous vraiment créer ce nouveau contact ?");
                    if (!resp) {
                        return false;
                    }
                }
                form.data('checked', 'true');
                form.submit();
            });
        });
    });
</script>
{% endblock %}

{% block content %}
    <div class="row border-bottom mb-3">
        <div class="col"><p class="lead">Contact professionnel</p></div>
       <div class="col text-end"><p class="lead">{{ view.action }}</p></div>
    </div>

    <div class="row mb-3 justify-content-center">
        <div class="col-8">
            <form id="contact-form" data-checked="false" action="#" method="post">{% csrf_token %}
                <table class="table table-sm">
                  {{ form.as_table }}
                </table>
                {% include "actions.html" %}
            </form>
        </div>
    </div>
{% endblock %}