JavaScript: error ajaxSubmit

Question

Tengo la siguiente función JS activado por un botón:

function uploadPicture() { 
    $("form#pictureUpload").ajaxSubmit({ 
     data: $("form#pictureform").serialize(), 
     type: 'post', 
     url: '?action=loadpicture', 
     success: function(response) { 
      $('#div-pictures').html(response); 
     } 
    }); 

}

Esto funcionó perfectamente bien durante varios meses. Pero dejó de funcionar hoy en Firefox, Safari, Chrome y Opera, aunque todavía funciona correctamente en Internet Explorer.

Safari me da el siguiente error misteriosa:

Failed to load resource: cancelled  ?action=loadpicture 

Chrome emite casi la misma (sin : cancelled). Opera y Firefox no muestran ningún error. La única información adicional es que los errores anteriores se producen después de que finaliza la carga del archivo y aunque el servidor genera una salida HTML como comentarios que los navegadores ignoran.

Háganme saber si tiene alguna idea de cómo solucionar esto. He estado corriendo en círculos durante horas sin siquiera acercarme a una solución: simplemente no veo errores en el código ni en los archivos de registro. ¡Muchas gracias!

Answer 1

Me tomó un tiempo, pero finalmente Lo averigué. Uno de nuestros administradores añadido a la configuración de Apache:

que causó un problema en cierta navegador debido al uso de iframe descrito en http://jquery.malsup.com/form/#file-upload. Después de cambiar a la siguiente todo funciona de nuevo (no hay cambios en el código!):

Header append X-FRAME-OPTIONS "SAMEORIGIN" 

De todos modos, el mensaje de error en Safari & Chrome son crípticos. El comportamiento extraño sin ningún mensaje de error en el otro navegador es aún peor.

Answer 2

Hmmm usted no debe estar usando la cadena de consulta en la URL, porque cuando se llama a serializar su va a conseguir convertir los datos en una consulta encadenan Prueba esto:

$("form#pictureUpload").ajaxSubmit({ 
     data: 'action=loadpicture&'+$("form#pictureform").formSerialize(), 
     type: 'post', 
     success: function(response) { 
      $('#div-pictures').html(response); 
     } 
    });