la devolución de llamada al progreso siempre muestra una carga del 100% en el plugin jquery-file-upload

Question

Quiero implementar una barra de progreso para el complemento blueimp jquery-file-upload pero la devolución de llamada progress solo se activa una vez inmediatamente después de que comience la carga y los datos. loaded == data.total.

<input data-url="/ads/32/photos" id="image" name="image" type="file" /> 

$(".upload-btn input").fileupload({ 
    dataType: "json", 
    progress: function(e, data) { 
     alert(data.loaded + "/" + data.total); 
    }, 
    done: function(e, data) { 
     alert("done"); 
    } 
    }); 

segundos más tarde (cuando la carga completa) la devolución de llamada se dispara hecho y puedo confirmar a través de los registros del servidor que la carga se ha realizado con éxito. Obtengo el mismo comportamiento cuando trato de usar la devolución de llamada progressall también.

No estoy seguro de si está relacionado, pero actualmente no incluyo la biblioteca jquery.fileupload-fp.js ya que al agregar esto evito que suceda cualquier actividad de carga.

¿Alguna idea de lo que estoy haciendo mal?

Answer 1

¿La función de progreso alert está utilizando la cadena "100%"? No estoy familiarizado con el complemento, pero la expresión en alert para la función progress arroja todo al tipo String. Entonces, esperaría que muestre la cadena "x/y".

En cualquier caso, debe cambiar la función progress a

alert(data.loaded/data.total); // no quotes, no +'s 

Si esos atributos (total y loaded) son correctas, entonces hay que darle el comportamiento que desea.

Editar: Para aclarar lo que está sucediendo, si esto responde a su pregunta: el operador + se comporta de diferentes maneras según el tipo de datos de sus operandos. Si + dos números juntos, funciona como un operador de suma aritmético. Si incluso uno de los operadores es una cadena, el + primero cambiará los otros operandos a cadenas primero, y luego concatenará ellos. El resultado final será una cadena, no un número.

var two = "2"; // two is a String data type 
alert(two + 2); // Returns "22" as a String 

var two = 2; 
alert(two + 2); // Returns 4 

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Arithmetic_Operators#Addition