{% load i18n %}
{% if form.errors %}
    <div class="oh-wrapper">
      <div class="oh-alert-container">
        {% for error in form.non_field_errors %}
        <div class="oh-alert oh-alert--animated oh-alert--danger">{{ error }}</div>
        {% endfor %}
      </div>
    </div>
{% endif %}
<div class="oh-modal__dialog-header">
  <span class="oh-modal__dialog-title" id="editDialogDialog">
    {% if form.instance.id %}
      {% trans "Update Compensatory Leave Request" %}
    {% else %}
      {% trans "Create Compensatory Leave Request" %}
    {% endif %}
  </span>
  <button class="oh-modal__close" aria-label="Close">
    <ion-icon name="close-outline"></ion-icon>
  </button>
</div>
<div class="oh-modal__dialog-body">
  <form
    {% if form.instance.id %}
      hx-post="{% url 'update-compensatory-leave' form.instance.id %}"
    {% else %}
      hx-post="{% url 'create-compensatory-leave' %}"
    {% endif %}
    hx-target="#objectDetailsModalTarget"
    hx-encoding="multipart/form-data"
    >
    {% csrf_token %} {{form.as_p}}
  </form>
</div>
<script>
  $(document).ready(function () {
    $("select").on("select2:select", function (e) {
      $(".leave-message").hide()
      $(this).closest("select")[0].dispatchEvent(new Event("change"));
    });
  });
</script>
