{% extends "ishtar/forms/qa_base.html" %}
{% load i18n inline_formset table_form %}

{% block main_form %}
    {% if form.non_field_errors %}
    <div class="alert alert-danger" role="alert">
        {{form.non_field_errors}}
    </div>
    {% endif %}

    {% for hidden in form.hidden_fields %}
    {{hidden}}
    {% if hidden.errors %}<div class="invalid-feedback">
        {{ hidden.errors }}
    </div>{% endif %}
    {% endfor %}

    {% if form.basket %}
    <div class="form-row">
        <input type="radio" name="create_or_update" value="create"
               id="create-choice" checked >
        &nbsp;<label for="create-choice">{% trans "New" %}</label>
    </div>
    {% else %}
    <input type="hidden" name="create_or_update" value="create">
    {% endif %}
    <div id="new-basket">
        <div class="form-row">
            {% with form.label as field %}
            {% include "blocks/bs_field_snippet.html" %}
            {% endwith %}
        </div>
    </div>
    {% if form.basket %}
    <div class="form-row">
        <input type="radio" name="create_or_update" value="update"
               id="update-choice">
        &nbsp;<label for="update-choice">{% trans "Add" %}</label>
    </div>
    <div id="update-basket">
        <div class="form-row">
            {% with form.basket as field %}
            {% include "blocks/bs_field_snippet.html" %}
            {% endwith %}
        </div>
    </div>
    {% endif %}
{% endblock %}

{% block js %}
var update_form_display = function(){
    if ($("#update-choice:checked").length){
        $("#new-basket").hide();
        $("#update-basket").show();
    } else {
        $("#update-basket").hide();
        $("#new-basket").show();
    }
}

$(document).ready(function(){
    $("#create-choice").click(update_form_display);
    $("#update-choice").click(update_form_display);
    update_form_display();
});

{% endblock %}