{% extends "workflow/viewport-element.html" %}
{% load staticfiles %}

{% load bootstrap4 %}

{% block content %}

<style>
#resource_meta_form {
    padding: 80px;
    display: grid;
}

#resource_meta_form td > * {
    width: 100%;
    margin-bottom: 20px;
    margin-top: 20px;
}

#resource_meta_form > table > tbody > tr {
    border-bottom: 1px solid #cccccc;
}

#resource_meta_form > table > tbody > tr:last-child {
    border-bottom: none;
}

</style>

<form id="resource_meta_form" method="post" action="/wf/workflow/">
    {% csrf_token %}
    <table>
        {{form}}
    </table>
</form>
{% endblock content %}

{% block onleave %}
var ajaxForm = $("#resource_meta_form");
var formData = ajaxForm.serialize();
req = new XMLHttpRequest();
req.open("POST", "/wf/workflow/", false);
req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
req.onerror = function() { alert("problem submitting form"); }
req.send(formData);
{% endblock %}