Ir para conteúdo
Fórum Script Brasil
  • 0

Ajuda ! Script De Fotos - Upload

douglasdamame

Perguntado por douglasdamame,

 Share

Pergunta

douglasdamame

douglasdamame

Postado
Postado

Peguei aqui no forum um Script de verifica a extensão e o tamanho do arquivo para Upload, por sinal Muiito Bom....

A questão agora é que quando o arquivo é inválido, sendo pela Extensão ou pelo Tamanho, o Campo continua com o endereço, então se o usuário enviar, será cadastrado no BD. Como limpar o campo preenchido???? Lembrando que existem outros campos no formulário então não da para dar um RESET.....

Segue abaixo o Codigo:

-----------------------------------------------------------

Segue o código com o erro resolvido... 

<html>
<head>
<title>Script de Fotos</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="/includes/estilos/azul.css" rel="stylesheet" type="text/css">
<style type="text/css">
<!--
.style4 {
color: #FF0000;
font-weight: bold;
font-size: 10px;
}
.style5 {font-size: 10px}
-->
</style>
<script>
var escondido = 0;

function preview()
{
img = document.getElementById('img');
if(escondido)
{
esc.innerHTML = '<a href="javascript:;" class="menu style5" onclick="preview()">(esconder)</a><br><img onload="getSize()" width="150" src="'+escondido+'" name="img" id="img">';
escondido = 0;
}
else
{
escondido = img.src;
img.src = '';
esc.innerHTML = '<a href="javascript:;" class="menu style5" onclick="preview()">(mostrar)</a><br><img onload="getSize()" src="1px.gif" width="1" height="1" name="img" id="img">';
}
}

function find_array(arr,str)
{
for(i=0; arr.length>i; i++)
{
if(arr[i] == str) return 1;
}
return 0;
}

function verificaFoto()
{
var obj = document.getElementById('file');
var v = obj.value;
var extencao=v.substr(v.length - 4).toLowerCase();
var extPerm = new Array(".gif",".jpg",".png","jpeg",".GIF",".JPG",".PNG","JPEG");
var img = document.getElementById('img');
img.src = "file://"+obj.value;
img.width = 200;
if(!find_array(extPerm,extencao))
{ 
alert("Só são permitidas fotos nos formatos GIF, PNG e JPG/JPEG");
obj.value = "";
esc.innerHTML = '<br><img onload="getSize()" src="1px.gif" width="1" height="1" name="img" id="img">';
return 0;
}

escondido = img.src;
if(escondido) preview(); 
}

function getSize()
{
if(document.getElementById('img').fileSize > 200000)
{
alert("A foto não pode ter mais de 200 KB.");
obj.value = "";
esc.innerHTML = '<br><img onload="getSize()" src="1px.gif" width="1" height="1" name="img" id="img">';

return 0;
}
return 1;
}





var escondido1 = 0;

function preview1()
{
img1 = document.getElementById('img1');
if(escondido1)
{
esc1.innerHTML = '<a href="javascript:;" class="menu style5" onclick="preview1()">(esconder)</a><br><img onload="getSize1()" width="150" src="'+escondido1+'" name="img1" id="img1">';
escondido1 = 0;
}
else
{
escondido1 = img1.src;
img1.src = '';
esc1.innerHTML = '<a href="javascript:;" class="menu style5" onclick="preview1()">(mostrar)</a><br><img1 onload="getSize1()" src="1px.gif" width="1" height="1" name="img1" id="img1">';
}
}

function find_array1(arr,str)
{
for(i=0; arr.length>i; i++)
{
if(arr[i] == str) return 1;
}
return 0;
}

function verificaFoto1()
{
var obj1 = document.getElementById('file1');
var v1 = obj1.value;
var extencao1 = v1.substr(v1.length - 4).toLowerCase();
var extPerm1 = new Array(".gif",".jpg",".png","jpeg",".GIF",".JPG",".PNG","JPEG");
var img1 = document.getElementById('img1');
img1.src = "file://"+obj1.value;
img1.width = 200;
if(!find_array(extPerm1,extencao1))
{ 
alert("São permitidas fotos nos formatos GIF, PNG e JPG/JPEG");
obj1.value = "";
esc1.innerHTML = '<br><img1 onload="getSize1()" src="1px.gif" width="1" height="1" name="img1" id="img1">';
return 0;
}

escondido1 = img1.src;
if(escondido1) preview1(); 
}

function getSize1()
{
if(document.getElementById('img1').fileSize > 200000)
{
alert("A foto não pode ter mais de 200 KB.");
obj1.value = "";
esc1.innerHTML = '<br><img1 onload="getSize1()" src="1px.gif" width="1" height="1" name="img1" id="img1">';

return 0;
}
return 1;
}
</script>

<script language="JavaScript">
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
// -->
</script>
</head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" bgcolor="#FFFFFF" text="#000000" link="#000000" vlink="#000000" alink="#666666">
<div id="Layer1" style="position:absolute; left:40%; top:-350px; width:300px; height:150px; z-index:1"> 
  <table width="300" border="0" cellpadding="0" cellspacing="0" class="tabelaborda">
    <tr> 
      <td height="20" colspan="3" class="tabelatopo"><font face="Tahoma" size="1">&nbsp;AGUARDE...</font></td>
    </tr>
    <tr> 
      <td height="10" colspan="3"><font face="Tahoma" size="1"><img src="1px.gif" width="1" height="1"></font></td>
    </tr>
    <tr> 
      <td width="10" rowspan="2">&nbsp;</td>
      <td width="280" align="center" valign="middle" class="verdana12"> 
        <div align="justify"><font face="Tahoma" size="1">Aguarde enquanto a foto 
          está sendo enviada. Isto pode levar alguns segundos. <strong>Não pare 
          este processo.</strong> </font></div>
      <td width="10" rowspan="2">&nbsp;</td>
    </tr>
    <tr> 
      <td height="12" colspan="3" class="noticialink"><font face="Tahoma" size="1"><img src="1px.gif" width="1" height="1"></font></td>
    </tr>
  </table>
</div>
<form>
  <table width="510" border="0" cellpadding="0" cellspacing="5">
    <input type="hidden" name="MAX_FILE_SIZE" value="1048576" />
    <tr> 
      <td valign="top"> 
        <p class="texto"><b><font face="Tahoma" size="1">FOTO 1 :<br>
          <input type="file" id="file" onChange="verificaFoto()" name="file" size="20"  />
          </font></b></p>
      </td>
    </tr>
    <tr> 
      <td valign="top" class="texto"><font face="Tahoma" size="1">Pré-visualização: 
        <label id="esc"><br>
        <img src="1px.gif" name="img" id="img" width="1" height="1"></label></font></td>
    </tr>
  </table>
  <hr size="1">
  <table width="510" border="0" cellpadding="0" cellspacing="5">
    <input type="hidden" name="MAX_FILE_SIZE" value="1048576" />
    <tr> 
      <td valign="top"> 
        <p class="texto"><b><font face="Tahoma" size="1">FOTO 2 :<br>
          <input type="file" id="file1" onChange="verificaFoto1()" name="file1" size="20"  />
          </font></b></p>
      </td>
    </tr>
    <tr> 
      <td valign="top" class="texto"><font face="Tahoma" size="1">Pré-visualização: 
        <label id="esc1"><br>
     
        <img src="1px.gif" name="img1" id="img1" width="1" height="1"></label></font></td>
    </tr>
  </table>
  <hr size="1">
</form>
</body>
</html>

VALEU,

DOUGLAS

Link para o comentário
Compartilhar em outros sites

5 respostass a esta questão

Posts Recomendados

  • 0
douglasdamame

douglasdamame

Postado
  • Autor
Postado

Olá Fercosminq,

O problema é se eu fizer um reload(), eu apagaria todos os campos.... ou não??

o meu form teria muito outros campos, como:

Titulo: textfield

Descrição: textfield

Categoria: Combo

fotos1: Filefield

fotos2: Filefield

fotos3: Filefield

fotos3: Filefield

Até tentei colocar "javascript:location.reload()" após o Alert, mas apaga todos os outros campos já preencidos !!!

Tem alguma outra forma de apagar sem o reload da página??

Eu estava pensando, na hora de submeter o form, colocar para verificar novamente o Function:

<form name="form" method="post" ENCTYPE="multipart/form-data" action="cad_anuncio.asp" onsubmit="return verificaFoto()>

Isso resolveria??? Eu ainda não testei, mas se sim cairia em um outro peoblema, pois neste form eu terei 6 Filefield, então serão 6 Function, como fazer o Onsubmit???

Link para o comentário
Compartilhar em outros sites
  • 0
douglasdamame

douglasdamame

Postado
  • Autor
Postado

Olá ............

Acabei de testar, colocando uma nova verificação na hora de submeter o formulário, mas não funcionou.

Até que é feito uma nova checagem e neste momento é mostrado novamente o Alert, mas quando se clica em OK, o Alert fecha e é encaminhando o campo com os valores inválidos automaticamente....

Link para o comentário
Compartilhar em outros sites
  • 0
Guest Albert

Guest Albert

Postado
Postado (editado)

Tente o seguinte:

Crie uma função, e dentro dela voce chama a função getSize(), e caso ocorra algo de errado, voce dá um alert e seta o campo desejado com value=''

Ficaria mais ou menos assim:

f

unction teste(){
  var a = getSize()
    if (condicaoSeErro){
     alert('campo errado!')
     document.getElementByID("suaID").value = ''
  }
}
... e na tag IMG: 
onload="teste();"

tenho vários forms e em todos eu utilizo a validação dos campos, não tenho ainda uma dessa forma que você quer, mais no meu caso todos estão funcionando corretamente.

[]'s

Editado por fercosmig
Utilize as tags de código, facilitam a visualização.
Link para o comentário
Compartilhar em outros sites
  • 0
KaKarotto

KaKarotto

Postado
Postado
o value do input tipe="file" não tem como mudar!

você pode fazer a verificacao no onsubmit!

em vez de dar um window.history.back(); na pagina, da um reload(); que os campos vem zerados.

abraços

É isso, não tem como modificar o campo do input file.

É exatamente o que o fercos falou, você tem que fazer a verificação no onsubmit.

<form name="form" method="post" ENCTYPE="multipart/form-data" action="cad_anuncio.asp" onsubmit="return verificaFoto()">

você espera o retorno no onsubmit, então a função verificaFoto() deve retornar false, caso não queira que o form submeta, ou true caso após a execução da função queira que o formulário seja enviado.

O que tem que fazer é a verificação das imagens e retorne falso para o formulário, assim o script vai ser executado mas o formulário não será mandado. Todas as funções estão retornando 0. Mania de programador de C...só falta chamar a main() rsrrsrs. Piada nerd...

Akelabrassssssss

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.

×
 Share
Ir para lista de Perguntas


  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,2k
×
×
  • Criar Novo...