How to specify each file in 2 input file?

0

I have 2 input file, one to select the profile photo and the other to choose a background photo. Each photo has different dimensions and I generate a preview before the user saves.

In the profile photo, all right. already in the background photo, the JS generates the visualization, but when I click save, it does not save and ends up disappearing with the photo in the profile. How do I specify the file of each photo in files []?

I have tried to put event as function parameter and call event, event.target and nothing worked.

Here's my code:

<?php
require "conexao.php";
if(!isset($_SESSION)) {
    session_start();
}
$idu = $_SESSION ['idu'];
if (isset($_FILES['arquivo'])) {
  	$extensao = strtolower(substr($_FILES['arquivo']['name'], -4));
  	$novo_nome = md5(time()).$extensao;
  	$diretorio = "uploads/";
  	move_uploaded_file($_FILES['arquivo']['tmp_name'], $diretorio.$novo_nome);
  	$sql=mysqli_query($con,"UPDATE bancodados SET foto='$novo_nome' WHERE id='$idu'");
}
if (isset($_FILES['segundplano'])) {
  	$extensao = strtolower(substr($_FILES['segundplano']['name'], -4));
  	$novo_nome = md5(time()).$extensao;
  	$diretorio = "uploads/";
  	move_uploaded_file($_FILES['segundplano']['tmp_name'], $diretorio.$novo_nome);
  	$sql=mysqli_query($con,"UPDATE bancodados SET imagemfundo='$novo_nome' WHERE id='$idu'");
}
?>
<!DOCTYPE html>
<html lang="pt-br">
<head>
	<meta charset="utf-8">
	<title>Editar Perfil</title>
	<link rel="stylesheet" type="text/css" href="css/editar-perfil.css">
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/ajax.js"></script>
	<script type="text/javascript">
		function visualizacao(){
			var target=document.getElementById("target");
			var file=perfil.arquivo.files[0];
			var reader= new FileReader();
			reader.onloadend=function (){
				target.src=reader.result;
				document.images['target'].width = 150;
			};
			if(file){
				reader.readAsDataURL(file);
			} else {
				target.src="imagens/usuario.jpg";
			}
		}
		function panofundo(){
			var alvo=document.getElementById("ft-bg");
			var arq=background.segundplano.files[0];
			var reader= new FileReader();
			reader.onloadend=function (){
				alvo.src=reader.result;
				document.images['ft-bg'].height = 300;
			};
			if(arq){
				reader.readAsDataURL(arq);
			} else {
				alert("falha na leitura do arquivo");
				alvo.src="imagens/possib-conex.jpg";
			}
		}
	</script>
</head>
<body>
	<div id="painel">
		<a class="voltar" href="perfil.php?id=<?php echo $idu; ?>" title="Voltar"><img src="imagens/voltar.jpg" alt="Voltar"></a>
  	    <a class="sair" href="logout.php" title="Sair"><img src="imagens/sair.jpg" alt="Sair"></a> 
	</div>
	<div id="container">
		<div id="ftperfil">
			<h1>Foto do perfil</h1>
			<div id="foto">
				<?php require "query-idu.php"; ?>
				<figure>
				    <img id="target" src="<?php echo $imagem; ?>" alt="Foto de Perfil" width="150"/>
				</figure>
			</div>
			<form name="perfil" action="editar-perfil.php" method="post" enctype="multipart/form-data">
		    	<label for="file">Escolher foto</label>
		    	<label for="salvarft">Salvar</label>
			    	<input type="file" id="file" name="arquivo" onchange="visualizacao()"/>
			    	<input id="salvarft" type="submit" value="Salvar"/>
     		</form>
	    </div>
	    <div id="fundo">
	    	<h1>Imagem segundo plano</h1>
	    	<div id="bg">
				<?php require "query-idu.php"; ?>
				<figure>
				    <img id="ft-bg" src="<?php echo $ftfundo; ?>" alt="Foto de Perfil" height= "300"/>
				</figure>
			</div>
	    	<form name="background" action="editar-perfil.php" method="post" enctype="multipart/form-data">
	    		<label class="img-bg" for="ftfundo">Escolher foto</label>
		    	<label class="img-bg" for="salvarft">Salvar</label>
		    	<input type="file" id="ftfundo" name="segundplano" onchange="panofundo()"/>
		    	<input id="salvarfundo" type="submit" value="Salvar"/>
			</form>
	    </div>
	</div>
</body>
</html>

In this case, both JS functions can not be files [0].

    
asked by anonymous 18.08.2017 / 23:52

0 answers