Enviar archivos por ajax y php

[novamix]

hola, como estan , espero que bien, bueno vulevo por aqui a ver si me podeis hechar una mano con esto.

estoy haciendo un formulario el cual envía una imagen y que posteriormente se guardan todos los datos en una bd.. ( de la imagen solo se guarda el nombre)

mi problema es que no se como pasar la imagen por ajax para que se envíe al que la procesa. a ver si me podéis hechar un mano os dejo el código. un saludo y gracias.

lo que hago es crear un formulario normal:

Código HTML:

<form name="nuevo_concierto" action="" 
onsubmit="enviarDatosConcierto(); return false">
        <label for="userfile">Cartel<a href="#" data-rel="tooltip" tabindex="99" title="<?php _e('Selecione el cartel del evento, preferentemente en un tamaño de 400px X 600px o proporcional'); ?>"><i class="icon-question-sign"></i></a></label>
    <input type="file" name="userfile" id="userfile" class=":required" >
    <br />  <input type="submit" name="enviar" id="enviar" value="Enviar" class="btn btn-primary" />
        <input type="reset" name="button" id="button" value="Restablecer" class="btn" /></form>
 

Evidentemete recorte el formulario para no rellenar.

posteriormente lo mando con ajax.

Código PHP:

  function enviarDatosConcierto(){ 
    //donde se mostrará lo resultados 
    divResultado = document.getElementById('resultado'); 
    //valores de los inputs 
    user_id=document.nuevo_concierto.user_id.value; 
    artista=document.nuevo_concierto.artista.value; 
    fecha=document.nuevo_concierto.fecha.value; 
    hora=document.nuevo_concierto.hora.value; 
    sala=document.nuevo_concierto.sala.value; 
    direccion=document.nuevo_concierto.direccion.value; 
    localidad=document.nuevo_concierto.localidad.value; 
    provincia=document.nuevo_concierto.provincia.value; 
    pais=document.nuevo_concierto.pais.value; 
    userfile=document.nuevo_concierto.userfile.value; 
    valor=document.nuevo_concierto.valor.value; 
 
     
    //instanciamos el objetoAjax 
    ajax=objetoAjax(); 
    //uso del medotod POST 
    //archivo que realizará la operacion 
    //registro.php 
    ajax.open("POST", "create_concert.php",true); 
    ajax.onreadystatechange=function() { 
        if (ajax.readyState==4) { 
            //mostrar resultados en esta capa 
            divResultado.innerHTML = ajax.responseText 
            //llamar a funcion para limpiar los inputs 
            LimpiarCampos(); 
        } 
    } 
    ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); 
    //enviando los valores 
    ajax.send("user_id="+user_id+"&artista="+artista+"&fecha="+fecha+"&hora="+hora+"&sala="+sala+"&direccion="+direccion+"&localidad="+localidad+"&provincia="+provincia+"&pais="+pais+"&userfile="+userfile+"&valor="+valor) 
}  
   

y por ultimo el archivo que lo precesa.

Código PHP:

  <?php 
include ('../conect.php'); 
 
if 
   (isset($_POST['artista'])) { 
 $user_id = $_POST['user_id']; 
 $artista = $_POST['artista']; 
 $fecha = $_POST['fecha']; 
 $hora = $_POST['hora']; 
 $sala = $_POST['sala']; 
 $direccion = $_POST['direccion']; 
 $localidad = $_POST['localidad']; 
 $provincia = $_POST['provincia']; 
 $pais = $_POST['pais']; 
 $valor = $_POST['valor']; 
 $userfile = $_POST['userfile']; 
// subida de imagenes 
 
 
    // Declare variables 
    // Get the basic file information 
    $userfile = $_FILES['userfile']['name']; 
    $file_size = $_FILES['userfile']['size']; 
    $file_temp = $_FILES['userfile']['tmp_name']; 
    $file_err = $_FILES['userfile']['error']; 
    $path = '../imagenes/'; 
   } 
    // Create a new file name 
    // This is so if other files on the server have the same name, it will be renamed 
    $randomizer = rand(0000, 9999); 
    $file_name = $randomizer.$userfile; 
 
// Get the file type 
    // Using $_FILES to get the file type is sometimes inaccurate, so we are going 
    // to get the extension ourselves from the name of the file 
    // This also eliminates having to worry about the MIME type 
    $file_type = $userfile; 
    $file_type_length = strlen($file_type) - 3; 
    $file_type = substr($file_type, $file_type_length); 
 
    if(!empty($userfile)) { 
        echo ''; 
 
        // limit the size of the file to 8 MB 
        if($file_size > 8388608) { 
            echo 'Imagen demaciado Grande.. El Tamaño Maximo es de 8 Mb<BR />'; 
            exit(); 
        } 
 
        // Set allowed file types 
        // Set case of all letters to lower case 
        $file_type = strtolower($file_type); 
        $files = array(); 
        $files[] = 'jpeg'; 
        $files[] = 'jpg'; 
        $files[] = 'gif'; 
        $files[] = 'png'; 
        // Search the array for the allowed file type 
        $key = array_search($file_type, $files); 
        if($key) { 
            echo '<b>Imagen Correcta</b><br />'; 
        } else { 
            echo '<b>La imagen no es validad. solo se admiten JPEG, JPG, GIF O PNG</b><br />'; 
            exit(); 
        } 
 
// Check for errors and upload the file 
 if(move_uploaded_file($file_temp, '../imagenes/' .$file_name.'')) { 
            echo '<h3>Imagen subida correctamente.</h3>'; 
        } else { 
            echo '<h3>ERROR</h3>'; 
        } 
} 
 
    else { 
        echo '<h3>Ningun Archivo Seleccionado.</h3>'; 
    } 
 
//registra los datos del empleados 
$sql = "INSERT INTO `v2`.`concierto` (`username`, `artista`, `fecha`, `hora`, `sala`, `direccion`, `localidad`, `provincia`, `pais`,`imagen`,`valor`) VALUES ( '$username', '$artista', '$fecha', '$hora', '$sala', '$direccion', '$localidad', '$provincia', '$pais','$file_name', '$valor');"; 
 
mysqli_query($conexion,$sql); 
$my_error = mysqli_error($conexion); 
 
if(!empty($my_error)) {  
 
echo "Ha habido un error al añadir el concierto. $my_error";  
 
} else{ 
echo "<div class='alert alert-success'> <button type='button' class='close' data-dismiss='alert'>×</button>Concierto  Añadido correctamete Correctamente.</div>"; 
} 
 
?>   

[David]

Para archivos tendrás que usar un iframe.

En algunos navegadores tendrás la opción de usar File API.

[novamix]

no hay ninguna opcion para enviar la imagen por ajax? que mal :(