dropzone

dropzones = [];
var id = 0;

function createDropzone() {

    function createDiv(className, id, parent){
        var div = document.createElement("div");

        if(className)
          div.className = className;

        if(id)
            div.id = id;

        if(parent)
            parent.appendChild(div);

        return div;
    }

    function createParagraph(innerHTML, parent){
        var p = document.createElement("p");

        if(innerHTML)
             p.innerHTML = innerHTML;

        if(parent)
            parent.appendChild(p);

        return p;
    }



    var container = document.getElementById("survey-gallery");
    var productName = document.getElementById("product-name");
    var productInfo = document.getElementById("product-info");

    var backendUrl = "test.php";
    var rowDivClassName = "row";
    var colDivClassName = "preview-col col-md-4";
    var dzDivName = "dropzone dz-clickable";
    var dzId = "drop" +id;

    var row = createDiv(rowDivClassName, '', container);
    var nameDiv = createDiv(colDivClassName, '', row);
    var infoDiv = createDiv(colDivClassName, '', row);
    var dzDiv = createDiv(colDivClassName, dzID, row);

    createParagraph(productName.value, nameDiv);
    createParagraph(productInfo.value, infoDiv);

    var dz = createDiv(dzDivName);
    dropzones.push(new Dropzone("div#" + dzId , {url: backendUrl}));

    id += 1;

    productInfo.value = '';
    productName.value = '';
}