error al cargar la imagen a través de Ajax

Estoy teniendo problemas para subir un archivo múltiple por ajax. Aquí está mi código.

Código HTML:-

 <input type="hidden" id="selectBusinessHiddenID" name="selectBusinessHiddenID" value="company_id; ?>">  

Código Ajax: –

 $("#uploadBusinessImg").on("click",function(e) { var fd = new FormData(); var file_data = $("#txtBusinessImage")[0].files; // for multiple files for(var i = 0;i<file_data.length;i++){ fd.append("file"+[i], file_data[i]); } var other_data = $("#selectBusinessHiddenID").serializeArray(); $.each(other_data,function(key,input){ fd.append(input.name,input.value); }); $.ajax({ url: '', data: fd, enctype: 'multipart/form-data', contentType: false, processData: false, type: 'POST', async : true, success: function(data){ alert(data); } }); }); 

Cuando estoy llamando a la función upload_business_photo_do () a través de Ajax, entonces no puede recibir el nombre de la imagen $ _FILES [‘archivo’] [‘nombre’]

 upload_business_photo_do() { $business_hidden_id=$this->input->post('selectBusinessHiddenID'); /*code for image*/ $config['upload_path']='./upload_101/'; $config['allowed_types']= 'jpg|png|jpeg'; $config['max_width'] = '6000'; $config['max_height'] = '4500'; $this->load->library('upload',$config); for($i=0; $iupload->do_upload()) { /*----set flash message*/ echo "error"; } else { echo "done"; } } } 

Intenta usarlo así, es simple y fácil.

  $("#uploadBusinessImg").on("click",function(e) { var formData = new FormData($("#form_name")[0]); $.ajax({ url: '', processData: false, contentType: false, data: formData, type: 'POST', async : true, success: function(data){ alert(data); } }); }); 

y en el uso del controlador como este

 if($_FILES['txtBusinessImageName']) { $file_ary = $this->reArrayFiles($_FILES['txtBusinessImageName']); foreach ($file_ary as $file) { print 'File Name: ' . $file['name']; print 'File Type: ' . $file['type']; print 'File Size: ' . $file['size']; } } 

y también use esta función para convertir datos de archivos en una matriz para datos de imágenes múltiples

 function reArrayFiles(&$file_post) { $file_ary = array(); $file_count = count($file_post['name']); $file_keys = array_keys($file_post); for ($i=0; $i<$file_count; $i++) { foreach ($file_keys as $key) { $file_ary[$i][$key] = $file_post[$key][$i]; } } return $file_ary; } 

Está funcionando perfectamente, solo trata de usarlo. no es necesario agregar códigos adicionales de archivos con ajax.

Utilice la etiqueta de formulario y el botón Enviar para cargar archivos.

 

y elimine enctype: ‘multipart / form-data’, desde ajax call and try.

Cambie lo siguiente para recuperar archivos:

 var file_data = $('#txtBusinessImage').prop('files')[0]; var fd = new FormData(); fd.append('file', file_data);