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 :(