javascript - example - DropzoneJS: ¿Cómo obtener la respuesta de PHP después de subir el éxito?

dropzone params

Question

Estoy tratando de implementar Dropzone en mi sitio. Quiero escuchar el evento de "éxito" y luego tomar la respuesta del servidor y agregar algo de información a un formulario en la misma página que DropZone después de que se complete la carga.

la información que quiero obtener en la respuesta del servidor es un enlace directo al archivo.

el sitio web de dropzone: http://www.dropzonejs.com/

el sitio web de mi proyecto:

http://37.34.62.131/test/

así que completé esto en una versión anterior de mi proyecto, pero no puedo entender cómo hacerlo con dropzone.js

ejemplo de trabajo:

http://37.34.62.131/test/uploader%201.0/

Lo que intento hacer es cuando se ha subido un archivo. Quiero que la respuesta php vuelva a estar en la misma página con los enlaces de descarga que se muestran a continuación.

También puedo enviarle mis códigos fuente para que pueda buscarlo usted mismo.

mi código php quiero ver en la respuesta:

        print ''<h2>Picture Uploaded Successfuly!!!!</h2> <p id="codes">

      <img src="''.$imgurl.''" height="300" alt="Uploaded Picture" >
        <label for="codebb">BBCode:</label>
        <input type="text" id="codebb" value="[URL=''.$siteurl.''][IMG]''.$dlurl.''[/IMG][/URL]" onclick="javascript:this.focus();this.select();" readonly="true" /><br />
        <label for="codehtml">HTML Code: </label>
        <input type="text" id="codehtml" value=/'&lt;a href="''.$siteurl.''"&gt;&lt;img src="''.$dlurl.''" alt="''.$alt.''" /&gt;&lt/a&gt;/' onclick="javascript:this.focus();this.select();" readonly="true" /><br />
        <label for="codedirect">Direct Link:</label>
        <input type="text" id="codedirect" value="''.$dlurl.''" onclick="javascript:this.focus();this.select();" readonly="true" /></p>'';
        echo ".$newname";

¿Alguien puede ayudarme a entender lo que me estoy perdiendo?

Answer 1

Al mirar su sitio web, parece que pudo solucionar el problema.

De todos modos esto es para alguien que aún podría estar buscando. Necesita agregar el éxito de la función con dos parámetros. El primer param devuelto es siempre archivo, el segundo es la respuesta. Muestra:

$(function() {
        Dropzone.options.uiDZResume = {
            success: function(file, response){
                alert(response);
            }
        };
    });

Answer 2

La respuesta valida no funcionó para mí. Esto hace :

$(".mydrop").dropzone({ 
    url: upload_url, 
    success : function(file, response){
        console.log(file);
        console.log(response);
    }
});

Y en el lado php:

echo json_encode($whateverouwant);
die();

Answer 3

Ninguno de los anteriores funcionó para mí, pero esto ...

<script>

    Dropzone.autoDiscover = false;
$(function(){

    uploader = new Dropzone(".dropzone",{
        url: "http://locahost/upload",
        paramName : "uploadedFiles",
        uploadMultiple :false,
        acceptedFiles : "image/*,video/*,audio/*",
        addRemoveLinks: true,
        forceFallback: false,
        maxFilesize:1000,
        parallelUploads: 100,

    });//end drop zone

  uploader.on("success", function(file,response) {
   console.log(response)
  });



});//end jq
</script>

Answer 4

Pero si estoy usando este código, entonces tengo que eliminar la clase dropzone del formulario. De lo contrario arrojará este error.

throw new Error("Dropzone already attached.");
---------------------------------------------
new Dropzone("#myDropzone", { 
    maxFilesize: 2, // MB
    init: function() {
        this.on("success", function(file, responseText) {
            console.log(responseText);
        });
    }
});

Answer 5

Tuve algunos problemas con Dropzone, pero encontré esta solución:

new Dropzone("#myDropzone", { 
    maxFilesize: 2, // MB
    init: function() {
        this.on("success", function(file, responseText) {
            console.log(responseText);
        });
    }
});