jumpserver/templates/upload.html

{% extends 'base.html' %}
{% load mytags %}
{% block content %}
{% include 'nav_cat_bar.html' %}

<div class="wrapper wrapper-content animated fadeIn">
    <div class="row">
        <div class="col-lg-12">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>涓婁紶鏂囦欢</h5>
                <div class="ibox-tools">
                    <a class="collapse-link">
                        <i class="fa fa-chevron-up"></i>
                    </a>
                    <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                        <i class="fa fa-wrench"></i>
                    </a>
                    <ul class="dropdown-menu dropdown-user">
                        <li><a href="#">Config option 1</a>
                        </li>
                        <li><a href="#">Config option 2</a>
                        </li>
                    </ul>
                    <a class="close-link">
                        <i class="fa fa-times"></i>
                    </a>
                </div>
            </div>
            <div class="ibox-content">
                <div class="">
                    <form id="my-awesome-dropzone" class="dropzone" action="#">
                        <div class="dropzone-previews">
                            <input id="hosts" name="hosts"  type="text" class="form-control" required="涓嶈兘涓虹┖" placeholder="杈撳叆涓绘満鍦板潃锛岄�楀彿闅斿紑锛岀‘淇濅綘鏈夎緭鍏ヤ富鏈哄湴鍧�鐨勬潈闄�" size="80%">
                        </div>
                        <button type="submit" class="btn btn-primary pull-right">鍏ㄩ儴涓婁紶</button>
                        <div></div>
                    </form>
                </div>
                <div>
                    <div class="m text-right"><small>涓婁紶鏂囦欢鍒板悗绔湇鍔″櫒鐨�/tmp涓�锛�璇锋敞鎰忔煡鐪�</small> </div>
                </div>
            </div>
        </div>
    </div>
    </div>
</div>


<script>
    $(document).ready(function(){

        Dropzone.options.myAwesomeDropzone = {

            autoProcessQueue: false,
            uploadMultiple: true,
            parallelUploads: 100,
            maxFiles: 100,
            url: '/file/upload/',

            // Dropzone settings
            init: function() {
                var myDropzone = this;

                this.element.querySelector("button[type=submit]").addEventListener("click", function(e) {
                    e.preventDefault();
                    e.stopPropagation();
                    myDropzone.processQueue();
                });
                this.on("sendingmultiple", function() {
                });
                this.on("successmultiple", function(files, response) {
                    alert(response)
                });
                this.on("errormultiple", function(files, response) {
                });
            }

        }

   });

$('#my-awesome-dropzone').validator({
    timely: 2,
    theme: "yellow_right_effect",
    fields: {
        "hosts": {
            rule: "required",
            tip: "杈撳叆涓婁紶鐨凥ost",
            ok: "",
            msg: {required: "蹇呴』濉啓!"}
        }
    },
    valid: function(form) {
        form.submit();
    }
});
</script>


{% endblock %}