Upload image with php

Question

I’m looking for a way to upload an image inside a form criminal record.

But every solution I find does not serve me, because I need the upload to be done as soon as the user selects the image, without it being taken to another page through a input type="submit". There may even be a button Send, or Upload next to the input type="file", but remaining on the page!

The image name can even be drawn with a rand().

Answer 1

Upload images without refreshing 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 upload 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
In this file contains the code that uploads to a folder named "photos", if you do not use database just remove the line include('db.php') 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;
    }

?>

Ta tudo ai, load the image on the same page without giving Refresh.

Answer 2

An idea is to use an image-only form, the form target being an iframe on the page itself.

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