How to add 2 dropzone in same view

@{
Layout = null;
}

@Styles.Render("~/Content/dropzonescss")     
<form id="my-awesome-dropzone" class="dropzone" action="#">
                        <div class="dropzone-previews"></div>
                        <button type="submit" class="btn btn-primary pull-right">Submit this form!</button>
                    </form>
 <!-- DROPZONE -->
<script src="js/plugins/dropzone/dropzone.js"></script>


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

        Dropzone.options.myAwesomeDropzone = {

            autoProcessQueue: false,
            uploadMultiple: true,
            parallelUploads: 100,
            maxFiles: 100,

            // 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) {
                });
                this.on("errormultiple", function(files, response) {
                });
            }

        }

   });
</script>

There is an example where it works with 2 dropzone, but the css is disorganized because to be with the default css dropzone should be added to class dropzone .

When adding the dropzone class, the plugin does not work because it does not know which dropzone it is, url errors etc.     

@Styles.Render("~/Content/dropzonescss")
<link href="~/Scripts/dropzone/basic.css" rel="stylesheet">
<link href="~/Scripts/dropzone/dropzone.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
@section Scripts {   
@Scripts.Render("~/bundles/dropzonescripts")
@Scripts.Render("~/plugins/util")

<script type="text/javascript">
$( function() {
    //essas funções foram as unicas que possibilitaram a inserção de 2 dropzone na mesma tela
    $.fn.dropzone.uploadStarted = function(fileIndex, file, current_dropzone_id){
        alert(cur_id);
        //console.log("teste ouro")
        var infoDiv = $("<div></div>");
        infoDiv.attr("id", current_dropzone_id + "-info" + fileIndex);
        infoDiv.html("upload started: " + file.fileName);

        var progressDiv = $("<div></div>");
        progressDiv.css({
            'background-color': 'orange',
            'height': '20px',
            'width': '0%'
        });
        progressDiv.attr("id", current_dropzone_id + "-speed" + fileIndex);

        var fileDiv = $("<div></div>");
        fileDiv.addClass(current_dropzone_id + "-info");
        fileDiv.css({
            //'border' : 'thin solid black',
            //'margin' : '5px'
        });
        fileDiv.append(infoDiv);
        fileDiv.append(progressDiv);
        //console.log("teste nobre")
        $("#" + current_dropzone_id + "-info").after(fileDiv);
    };
    $.fn.dropzone.uploadFinished = function (fileIndex, file, duration, current_dropzone_id) {
        //console.log("teste salve")
        $("#" + current_dropzone_id + "-info" + fileIndex).html("upload finished: " + file.fileName + " ("+getReadableFileSizeString(file.fileSize)+") in " + (getReadableDurationString(duration)));
        $("#" + current_dropzone_id + "-speed" + fileIndex).css({
            //'width': '100%',
        //  'background-color': 'green'
        });

        if (current_dropzone_id) {
            //console.log("teste")
            // TAKE ACTIONS FOR A SPECIFIC DROPZONE ACTIVITY
        } else {
            // TAKE OTHER ACTIONS
        }
    };
    $.fn.dropzone.fileUploadProgressUpdated = function (fileIndex, file, newProgress, current_dropzone_id) {
       // console.log("teste rosa")
        $("#" + current_dropzone_id + "-speed" + fileIndex).css("width", newProgress + "%");
    };
    $.fn.dropzone.fileUploadSpeedUpdated = function(fileIndex, file, KBperSecond, current_dropzone_id){
        var dive = $("#" + current_dropzone_id + "-speed" + fileIndex);
        //console.log("teste mundo")
        dive.html( getReadableSpeedString(KBperSecond) );
    };
    /*
    $.fn.dropzone.newFilesDropped = function(current_dropzone_id){
        $("#" + current_dropzone_id + "-info").remove();
    };
    */

    $("#file-dropzone").dropzone({
        url : "@(System.Web.VirtualPathUtility.ToAbsolute("~/Documento/SaveDocumentoAjax/"))", // Set the url

        //printLogs: true,
        autoProcessQueue: false,            
        parallelUploads: 100,
        uploadMultiple: true, 
        uploadRateRefreshTime : 500,
        numConcurrentUploads: 2,
        dictDefaultMessage: "Arraste arquivos para cá ou clique para selecionar.",          
        success: function (response) {
            console.log(response);
            if (response.msg == "sucess") {
                htmlArquivos = " <input type='hidden' name='id_documentos[]' class='ids_documentos' value=" + response.idArquivo + " />";
                $('#divDocDigital').append(htmlArquivos);
                $(".alertDocumento").hide()
            }
        }
    });

    $("#anexo-dropzone").dropzone({
        url : "@(System.Web.VirtualPathUtility.ToAbsolute("~/Documento/SaveAnexoAjax/"))", // Set the url
        //printLogs: true,
        uploadMultiple: true,
        uploadRateRefreshTime : 500,
        numConcurrentUploads: 2,
        dictDefaultMessage: "Arraste arquivos para cá ou clique para selecionar."
    });
});
</script>
   }
<div class="">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title"><span class="glyphicon glyphicon-file">                  </span> Escolha o(s) arquivo(s)</h3>
            <small class="help-block">Envie arquivos de no máximo    <b>30</b>MB. Você poderá enviar arquivos das seguintes extensões: <b>PDF</b>, <b>DOC</b> e  <b>DOCX</b> .</small>
    </div>
    <div class="panel-body">
        <div class="ibox-content">
<!-- <div id="files-dropzone" class="dropzone">-->
            <div id="files-dropzone" class="">
                <div id="file-dropzone" class="dropzone-previews" style="width: 100%; height: 200px;"></div>
                <div id="file-dropzone-info" style="width: 50px;"></div>
            </div>
        </div>
    </div>
</div>
<div class="panel panel-default">
    <div class="panel-heading">
        <h3 class="panel-title"><span class="glyphicon glyphicon-paperclip"></span> Anexos</h3>
        <small class="help-block m-b-none">O anexo tem finalidade de complementar, possibilitando melhores informações não referenciados no documento.</small>
    </div>
    <div class="panel-body">
        <div class="ibox-content">
            <div id="anexos-dropzone" class="">
                <div id="anexo-dropzone" class="dropzone-previews" style="width: 100%; height: 200px;"></div>
                <div id="anexo-dropzone-info" style="width: 50px;"></div>
            </div>
        </div>
    </div>
</div>