2

Estoy trabajando en un sistema en el cual una de las funcionalidades principales es la carga de múltiples imágenes, este sistema lo estoy trabajando en codeigniter 3.

El problema: al momento de enviar el formulario todo excepto el input donde se carga las multiples imagenes me lo reconoce del lado del php, al enviar me genera el siguiente error del lado del codeigniter. Este error corresponde a esta linea:

$count_file = count($_FILES['file']['name']);

file es el nombre del input por el cual se cargan las imagenes

<input type="file" name="file[]" multiple accept="image/*" maxImg="5" id="file">

Como sabrán para enviar varios archivos se tiene que enviar dentro de un array.

introducir la descripción de la imagen aquí

Este es mi codigo con el cual envio el formulario

$('#frm_register_post').submit(function (ev) {
     alert('Registrando');
     $.ajax({
         url: $(this).attr("action"),
         type: $(this).attr("method"),
         dataType: 'json',
         ansyc: true,
         data: $(this).serialize(),
         success: function (data) {
             console.log(data);
             if (!data.error) {
                 alert(data.Mens);
                 window.setTimeout('location.href = "user/perfil"', 1000);
             } else {
                 alert(data.Mens);
                 $('#muestra_e').hide();
                 $('#form_e').show();
             }
         },
         error: function () {
             alert('Disculpe exitio un error de servidor al enviar los datos, intente mas tarde.');
             $('#muestra_e').hide();
             $('#form_e').show();
         }
     });
     ev.preventDefault();
 });

Alguien podría decirme el por que me sale este error y como solucionarlo.

Cabe resaltar que, sin el ajax todo funciona bien, pero quiero que al momento de enviar el formulario se muestre algún tipo de mensaje.

1
  • El error te esta diciendo que en $_FILES no hay ningún índice de nombre file. Sube el código de User.php en el que recoges los datos de la petición ajax para podamos ayudarte mejor. Y por último, en Ajax no envías un array, sino un objeto JSON que no deja de ser un String. Commented el 14 jun. 2019 a las 6:22

1 respuesta 1

2

No se pueden enviar archivos mediante AJAX usando serialize, tenés que usar FormData.

Te dejé comentadas las líneas que modifiqué. Algunos parámetros tienen que ver con los ajustes de $.ajax().

Tené en cuenta que siempre que estés enviando archivos lo tenés que hacer mediante POST. Lo aclaro porque el type lo estás obteniendo de manera dinámica.

$('#frm_register_post').submit(function (ev) {
    alert('Registrando');

    var formData = new FormData(this); // creamos un formData relacionado con el formulario actual

    $.ajax({
        url: $(this).attr("action"),
        type: $(this).attr("method"),
        dataType: 'json',
        ansyc: true,
        data: formData, // formData en vez de serialize
        contentType: false, // para que jQuery no setee un contentType
        processData: false, // para que jQuery no transforme data en un string
        success: function (data) {
            console.log(data);
            if (!data.error) {
                alert(data.Mens);
                window.setTimeout('location.href = "user/perfil"', 1000);
            } else {
                alert(data.Mens);
                $('#muestra_e').hide();
                $('#form_e').show();
            }
        },
        error: function () {
            alert('Disculpe exitio un error de servidor al enviar los datos, intente mas tarde.');
            $('#muestra_e').hide();
            $('#form_e').show();
        }
    });
    ev.preventDefault();
});
4
  • Probé usando el FormData, pero me sigue saliendo el mismo error Commented el 14 jun. 2019 a las 20:09
  • @JhonnyLuis podrías hacer un console.log(FormData) después de definir dicha variable para ver que contiene? El formulario se está enviando por POST y tenés definido en el mismo enctype="multipart/form-data"?
    – azeós
    Commented el 14 jun. 2019 a las 20:32
  • si claro que tengo enctype="multipart/form-data", y ya pude solucionarlo, en la variable data simplemente inicialice el FormData de esta forma data: new FormData(this) Commented el 14 jun. 2019 a las 21:18
  • @JhonnyLuis eso no es exactamente lo que puse yo? No cambiaste nada más?
    – azeós
    Commented el 15 jun. 2019 a las 7:10

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.