Image upload with php [duplicate]

Upload images without refresh using PHP and Jquery

First we will create the table in MySQL:

CREATE  TABLE 'test'.'fotos' (
'idfoto' INT NOT NULL AUTO_INCREMENT ,
'foto' VARCHAR(150) NULL ,
  PRIMARY KEY ('idfoto') );

index.php
This page contains the submission form and the div to view the image after uploading

<form id="formulario" method="post" enctype="multipart/form-data" action="upload.php">
Foto: 
<input type="file" id="imagem" name="imagem" />
</form>
<div id="visualizar"></div>

Javascript

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.form.js"></script>
<script type="text/javascript">
$(document).ready(function(){
     /* #imagem é o id do input, ao alterar o conteudo do input execurará a função baixo */
     $('#imagem').live('change',function(){
         $('#visualizar').html('<img src="ajax-loader.gif" alt="Enviando..."/> Enviando...');
        /* Efetua o Upload sem dar refresh na pagina */           $('#formulario').ajaxForm({
            target:'#visualizar' // o callback será no elemento com o id #visualizar
         }).submit();
     });
 })
</script>

upload.php
This file contains the code that uploads to a folder named "photos", in case you do not use the database just remove the include('db.php') line using the //

<?php
    include('db.php');
    $pasta = "fotos/";

    /* formatos de imagem permitidos */
    $permitidos = array(".jpg",".jpeg",".gif",".png", ".bmp");

    if(isset($_POST)){
        $nome_imagem    = $_FILES['imagem']['name'];
        $tamanho_imagem = $_FILES['imagem']['size'];

        /* pega a extensão do arquivo */
        $ext = strtolower(strrchr($nome_imagem,"."));

        /*  verifica se a extensão está entre as extensões permitidas */
        if(in_array($ext,$permitidos)){

            /* converte o tamanho para KB */
            $tamanho = round($tamanho_imagem / 1024);

            if($tamanho < 1024){ //se imagem for até 1MB envia
                $nome_atual = md5(uniqid(time())).$ext; //nome que dará a imagem
                $tmp = $_FILES['imagem']['tmp_name']; //caminho temporário da imagem

                /* se enviar a foto, insere o nome da foto no banco de dados */
                if(move_uploaded_file($tmp,$pasta.$nome_atual)){
                    mysql_query("INSERT INTO fotos (foto) VALUES (".$nome_atual.")");
                    echo "<img src='fotos/".$nome_atual."' id='previsualizar'>"; //imprime a foto na tela
                }else{
                    echo "Falha ao enviar";
                }
            }else{
                echo "A imagem deve ser de no máximo 1MB";
            }
        }else{
            echo "Somente são aceitos arquivos do tipo Imagem";
        }
    }else{
        echo "Selecione uma imagem";
        exit;
    }

?>

It's all there, load the image on the same page without giving Refresh.

One idea is to use a form only for the image, the target of the form being an iframe on the page itself.

After receiving the post in a PHP file, it redirects with an HTTP response 303 to another page that shows the image or image itself. Only the iframe changes the address, so the main page remains the same.