Pré Visualizar Imagem Antes Do Upload
olá pessoal estou desenvolvendo um site imobiliario, porém ainda sou um pouco leiga no php, um amigo meu estava me ajudando , porém agora ele não pode mais, é o seguinte o sistema que eu quero é o seguinte, digamos que no meu banco de dados tenha varios imóveis cadastrados e eu precise alterar apenas a foto do anuncio do imóvel e ainda ver a foto que vou mandar para o banco de dados e para a pasta antes de fazer o Upload da imagem. Sabem tipo o site do facebook quando vamos editar a imagem do perfil por exemplo e ele nos mostra a imagem carregada certo. Como faço isso.
Código onde faço os upload das imagens:
<?php
session_start();
if (isset($_SESSION['usuario'])&&isset($_SESSION['logado'])) {//verifico se foi passado o ID do imóvel
if (!isset($_GET['id'])):
//Caso não voltar a pagina
echo '<div class="erro">Operação incorreta</div>';
header('Refresh: 1; ?pag=imoveis_fotos');else:
$imv_id = $_GET['id'];
endif;//verifico a quantidade de fotos que existe no imovel
$fotos = new Conexao();
$fotos->ExecSQL("select * from imoveis_fotos where foto_imovel = '$imv_id'");//tratando o limite de fotos
$limite = (Sistema::getLimiteFotos() - $fotos->TotalRegistros());
?>
<script src="../lightbox/js/jquery-1.11.0.min.js"></script>
<script src="uploadify/jquery.uploadify.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="uploadify/uploadify.css">
<div class="texto">
<p id="quem" style="margin-bottom:40px;">Adicionar imagens
</p>
<?php
echo '<center><div style="border:1px solid #000; width:500px; margin-bottom:50px; font-weight:bolder;">Este imóvel tem ' . $fotos->TotalRegistros() . ' imagens, o limite é ' . Sistema::getLimiteFotos() . '.<br>Você pode enviar ainda: ' . $limite . ' imagem(s)</div></center>';if($limite < 1):
die('<div id="erro">O limite de imagem deste imóvel esgotou. Caso queira outras imagens precisa apagar algumas.</div>');
endif;
?>
<script src="uploadify/jquery.uploadify.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="uploadify/uploadify.css">
<center> <form>
<div id="queue"></div>
<input id="file_upload" name="file_upload" type="file" multiple="true">
</form>
<script type="text/javascript">
<?php $timestamp = time();?>
$(function() {
$('#file_upload').uploadify({
'formData' : {
'imovel': '<?php echo $imv_id ;?>',
'timestamp' : '<?php echo $timestamp;?>',
'token' : '<?php echo md5('unique_salt' . $timestamp);?>'
},
'swf' : 'uploadify/uploadify.swf',
'uploader' : 'uploadify/uploadify.php',
'buttonText': 'Selecionar arquivo',
'uploadLimit': <?php echo $limite ?>,
// depois de terminar
'onQueueComplete' : function(queueData) {
alert(queueData.uploadsSuccessful + ' Imagem (ns) foram carregadas.');
url = '?pag=imoveis_fotos&id=<?php echo $imv_id ;?>';
$(location).attr("href",url);
} // fim do onQueueComplete
});
});
</script>
</center>
</div>
<a style="background: #73c425; font-family:'OpenSans', sans-serif; padding: 5px; margin-left: 10px; font-size: 15px; text-transform:none;" href="?pag=imoveis_fotos&id=<?php echo $imv_id; ?>">Voltar</a>
<?php } else {header("Location:login.php");} ?>Discussão (1)
Carregando comentários...