re2o/machines/templates/machines/edit_portlist.html

{% extends "machines/sidebar.html" %}
{% comment %}
Re2o est un logiciel d'administration développé initiallement au rezometz. Il
se veut agnostique au réseau considéré, de manière à être installable en
quelques clics.

Copyright © 2017  Gabriel Détraz
Copyright © 2017  Goulven Kermarec
Copyright © 2017  Augustin Lemesle

This program is free software; you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation; either version 2 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License along
with this program; if not, write to the Free Software Foundation, Inc.,
51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
{% endcomment %}

{% load bootstrap3 %}

{% block title %}Création et modification de machines{% endblock %}

{% block content %}
{% bootstrap_form_errors port_list %}


<form class="form" method="post">
    {% csrf_token %}
    {% bootstrap_form port_list %}
    {{ ports.management_form }}
    <div id="formset">
    {% for form in ports.forms %}
    	<div class="port">
	    <p>
	        {{ form }}
	    </p>
	</div>
    {% endfor %}
    </div>

    <p>
        <input class="btn btn-primary btn-sm" role="button" value="Ajouter un port" id="add_one">
    </p>

    {% bootstrap_button "Créer ou modifier" button_type="submit" icon="star" %}
</form>
<script type="text/javascript">
    var template = `{{ports.empty_form}}`;
    function add_port(){
        var new_index = document.getElementsByClassName('port').length;
	document.getElementById('id_form-TOTAL_FORMS').value =
            parseInt(document.getElementById('id_form-TOTAL_FORMS').value) + 1;
	var new_port = document.createElement('div');
	new_port.className = 'port';
	new_port.innerHTML = template.replace(/__prefix__/g, new_index);
	document.getElementById('formset').appendChild(new_port);
    }
    document.addEventListener("DOMContentLoaded", function() {
        document.getElementById("add_one").addEventListener("click", add_port, true);});

</script>
{% endblock %}