ayuda con select php

[xavidenia]

 hola buenas tardes

estoy creando un select  para un formulario  de comentarios  la funcion de este select quiero que sea la de seleccionar una imagen(avatar) y escribir la url en la base de datos  a ese usuario o sea que se quede relacionada la imagen y el usuario.....

pero que al mismo tiempo cuando el usuario seleccione una imagen se vea la imagen arriba del select
y ademas que dentro del select haya una opcion de personalizar en la que pueda abrir un input type=file  o de alguna otra forma buscar una imagen , subirla al server
y añadir la ulr de esta imagen a la base de datos........

esto es lo que he conseguido hacer hasta ahora pero no  me muestra la imagen......

Código [Seleccionar] Expandir


<p class=" avatar text-warning">Avatar:<p>
<?php
$formatos_imagen = array('.png', '.gif');
$extension_archivo = substr($nombre_archivo, strrpos($nombre_archivo, '.'));
$directorio = 'img/icons/avatar/';
$dir = opendir("$directorio") ;
$imagen = $directorio . $file;
echo '<select class="seleccion_avatar" name="avatar_usuario" onChange="showimage()">';
   echo '<option class="opcion" value=$directorio/Anonimo.png selected>- Sin imagen -</option>'; while ($file = readdir($dir)) 
{
if ($file != "." && $file != "..") 
{
echo '<option class="opcion" value=$file>$file</option>';
}
}
echo '<option class="opcion">Personalizar</option>';

echo" </select>";
?>
<img class="image_avatar" id="imagen" src="<?php echo $ruta.$file ?>" alt="" name="avatar_usuario" onload="recargar()"
width="108px" height="auto">
<?php
 closedir($dir);
?>


alguien puede decirme u orientarme sobre como tengo que hacer para que al seleccionar una imagen en el select se me previsualice arriba del select,

y como hacer para que me escriba la url de la imagen en la base de datos?????

subo tambien archivo sql del formulario de comentarios......

Código [Seleccionar] Expandir


<?php //SQL insertar nuevo comentario a Tabla Comentarios

//Comprobamos si esta definida nuestra variable de envio(submit)
if(isset($_POST['insertar_comentario'])){

//incluimos conexion
require_once('includes/conexion_blog.inc.php');

//Obtenemos datos Formulario(escapando string por seguridad)
$usario = mysqli_real_escape_string($ConDB, $POST['usuario']);
$avatar_usuario = mysqli_real_escape_string($ConDB, $POST['avatar_usuario']);
$comentario = mysqli_real_escape_string($ConDB, $POST['comentario']);
$fecha = mysqli_real_escape_string($ConDB,$POST['fecha']);


// Comprobamos Campos obligatorios
if($usuario && $avatar_usuario && $comentario && $fecha){

//Si todo esta bien inyectamos datos a nuestra base de datos
$sql = "INSERT INTO comentarios VALUES('', '{$_GET['id']}', '$usuario', '$avatar_usuario', '$comentario', '$fecha')";

mysqli_query($ConDB, $sql);
//Redirigimos a nuestro comentario Publicado
header('location: #comentario');
//cerramos conexion
mysqli_close($ConDB);


}else{
echo'<div class="holder-error">Debes rellenar todos los campos</div>';
}
}// Fin Isset
?>


archivo javascript del select

Código [Seleccionar] Expandir


<SCRIPT type="text/javascript">
function showimage() {
if (!document.images)
return
document.images.avatar.src=
'avatar/' + document.formulario.avatar.options[document.formulario.avatar.selectedIndex].value
}
</SCRIPT>