{% extends "base.html" %}

{% block title %}
    批量删除
{% endblock %}

{% block head %}
    <script src="/static/js/jquery.bootstrap-duallistbox.js"></script>
    <link rel="stylesheet" type="text/css" href="/static/css/bootstrap-duallistbox.css">
{% endblock %}

{% block content %}
    <div class="section section-breadcrumbs section-breadcrumbs-backend">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <h1>批量删除</h1>
                </div>
            </div>
        </div>
    </div>
    <div class="btn-toolbar">
        <div class="btn-group">
            {% url "listuserurl" as thelistuserurl %}
            <a class="btn btn-default {%if request.path = thelistuserurl%} active {%endif%}" href={{ thelistuserurl }}><span class="glyphicon glyphicon-list"></span>用户列表</a>
            {% url "removesusersurl" as theremovesusersurl %}
            <a class="btn btn-default {%if request.path = theremovesusersurl%} active {%endif%}" href={{ theremovesusersurl }}><span class="glyphicon glyphicon-list"></span>批量删除</a>
        </div>
    </div>

    <hr/>

    <form class="form-horizontal" role="form" action={% url "removesusersurl" %} method="POST" enctype="multipart/form-data">
    {% csrf_token %}

        {% for item in form %}
            <div class="form-group">
                <label class="control-label col-md-1">{{item.label}}</label>
                <div class="col-md-11">
                    {{item}}
                </div>
                <div class="col-md-offset-1 col-md-10">
                    {{item.errors}}
                </div>
            </div>
        {% endfor %}

        <div class="form-group">
            <div class="col-md-offset-1 col-md-10">
                <button type="submit" class="btn btn-danger btn-sm" onclick="return confirm('确认批量删除吗？')">批量删除</button>
            </div>
        </div>

    </form>
    
    <script>
        var demo1 = $('select[name="classid"]').bootstrapDualListbox({
              nonSelectedListLabel: '可选择分组',
              selectedListLabel: '已选择分组',
              preserveSelectionOnMove: 'moved',
              moveOnSelect: false,
        });
    </script>
{% endblock %}