Agregue la función de carga de imágenes dentro de este código ajax existente

Mi código aquí funciona bien, excepto la carga de imágenes. Inserta todos los datos en la base de datos.

 

Pero después de agregar la entrada de tipo de archivo en php está mostrando

Aviso: índice indefinido: imagen2 en C: \ xampp \ htdocs \ upload \ submit.php en la línea 18

¿Cómo puedo agregar la función de carga de imágenes en mi código existente?

 
// here is the problem //here is the problem
$(document).ready(function() { // submit form using $.ajax() method $('#reg-form').submit(function(e){ e.preventDefault(); // Prevent Default Submission $.ajax({ url: 'submit.php', type: 'POST', data: $(this).serialize() // it will serialize the form data }) .done(function(data){ $('#form-content').fadeOut('slow', function(){ $('#form-content').fadeIn('slow').html(data); }); }) .fail(function(){ alert('Ajax Submit Failed ...'); }); });

submit.php

  

Puedes usar FormData, también sugiero que puedes cambiar la identificación de los elementos del formulario, ahora todos tienen (‘lname’) Prueba esto con tu actual:

En tu HTML, pon una identificación a tu entrada de archivo

  

Y cambie la identificación de la otra entrada.

En tu JavaScript:

 var frmData = new FormData(); //for the input frmData.append('image2', $('#image2')[0].files[0]); //for all other input $('#reg-form :input').each(function(){ if($(this).attr('id')!='image2' ){ frmData.append($(this).attr('name'), $(this).val() ); } }); $.ajax( { url: 'URLTOPOST', type: 'POST', data: frmData, processData: false, contentType: false }).done(function( result ) { //When done, maybe show success dialog from JSON }).fail(function( result ) { //When fail, maybe show an error dialog }).always(function( result ) { //always execute, for example hide loading screen }); 

En su código PHP, puede acceder a la imagen con $ _FILE y la entrada con $ _POST

FormData () funciona en los navegadores modernos . Si desea utilizar un navegador más antiguo, use el complemento malsup / form

Su formulario

 

Javscript

  

En php extract($_POST) para obtener todos los datos de entrada y $_FILE para archivos