Krajee Bootstrap File Input, capturando la respuesta de éxito de AJAX

Ángel, miembro de este staff, nos hizo el favor de redactar este artículo porque controla a la perfección este tema.

Solución:

Puede ver una demostración aquí demostración en vivo

Recuerde configurar cargarAsync false si quieres que el evento de exito se dispare

Código de ejemplo:

JS

$("#input-id").fileinput(
    showRemove:false,
    showPreview: false,
    uploadUrl: "../xxxx/xxxx/XXXXXX.php", // server upload action
    uploadAsync: false,
    uploadExtraData: function() 
        return 
            bdInteli: xxxx
        ;
    
);

// CATCH RESPONSE
$('#input-id').on('filebatchuploaderror', function(event, data, previewId, index) 
var form = data.form, files = data.files, extra = data.extra, 
    response = data.response, reader = data.reader;
);

$('#input-id').on('filebatchuploadsuccess', function(event, data, previewId, index) 
    var form = data.form, files = data.files, extra = data.extra, 
    response = data.response, reader = data.reader;
    alert (extra.bdInteli + " " +  response.uploaded);
);

PHP

$nombre = $_FILES["ficheroExcel"]["name"];
$bdInteli = $_POST['bdInteli'];
if (move_uploaded_file($_FILES["ficheroExcel"]["tmp_name"], $nombre) )
    $output = array('uploaded' => 'OK' );
 else 
   $output = array('uploaded' => 'ERROR' );

echo json_encode($output); 

Puede leer la sección de eventos en la página de documentación del complemento para comprender los diversos eventos proporcionados por el complemento.

Depende de cómo haya configurado la carga de ajax en el complemento. El complemento ofrece dos modos de carga ajax: síncrono y asíncrono, como se describe en la documentación. Es asíncrono si tienes uploadAsync propiedad establecida en true.

PARA LA TRAMPA DE ÉXITO DE AJAX:

• puede usar el evento filebatchuploadsuccess para cargas síncronas
• puede usar el evento fileuploaded para cargas asíncronas

PARA LA TRAMPA DE ERROR DE AJAX:

• puede usar el evento filebatchuploaderror para cargas síncronas
• puede usar el evento fileuploaderror para cargas asíncronas

En tu caso has puesto uploadAsync ajustado a true – así que use la configuración/eventos asincrónicos.

puede usar este código de muestra en su prueba. En mi prueba, mis datos de respuesta son así:

response data:
{
"ver":"1.0",
"ret":true,
"errmsg":null,
"errcode":0,
"data":
    "status":"upload success",
    "originalFilename":"testFileName.txt",
    "fileName":"excelFile",
    "fileType":"text/plain",
    "fileSize":1733


 javascript code:
 $('#input-id').on('fileuploaded', function(event, data, previewId, index) 
    var response = data.response;
    if(response.ret ) 
        alert("upload success!"+data.response.data);
    else
        alert("upload failed!"+response.errmsg)
    
    alert('File uploaded triggered'+form+"response:"+response);
    console.info(response.data);
);

Te mostramos las reseñas y valoraciones de los usuarios

Nos encantaría que puedieras dar difusión a esta crónica si lograste el éxito.

---

---

Utiliza Nuestro Buscador