Newsgroup: it.comp.lang.javascript
Titolo: Controllo su Immagine

Ciao a tutti,
Devo prima di uplodare un'immagine controllare quanto è larga e quanto è
alta, poi se non supera una certa dimensione andare avanti con l'upload o,
in caso contrario (se l'immagine è troppo grande) resettare il form e non
inviare nulla.
Ora grazie ad un forum ho messo insieme questo:
<script>
function precarica(){
	nomeFile = myForm.myFile.value;
if (nomeFile=="") return;
// isolo l'estensione e verifico che sia fra quelle permesse
	extFile=nomeFile.substr(nomeFile.lastIndexOf(".")+1);
	permesse="#jpg#gif#bmp#png#";
	if (permesse.indexOf("#"+extFile+"#")==-1) {
		alert(extFile + " non e' un file permesso");
		return;
	}  
	myImg.src = nomeFile; 
}
function misura(){
	largo=myImg.width; 
	alto=myImg.height; 
	grosso=myImg.fileSize;
	alert(largo+" x "+alto+" : "+grosso)
	if ((largo > 200)){
         alert ("immagine troppo grande!");
         document.myForm.reset();
	}
}
</script>
</HEAD>
<BODY>
<!-- ' -->
<form ENCTYPE="multipart/form-data" method="post" name=myForm
onSubmit='precarica();'>
<input type=file name=myFile width=200" accept="image/*">
<INPUT TYPE="submit">
</form>
<img name=myImg style="visibility:hidden" onload="misura()">
ma non  ho raggiunto il mio intento perhè anche se l'immagine supera i 200
di larghezza lo stesso mi viene inviata la variabile sul server
Mi chiedevo appunto cosa mancasse ancora o dove sbaglio per far in modfo
che se l'immagine è grande non succeda nulla e mi compaia anche un
messaggio "immagine troppo grande".
Graszir dell'attenzione,
Giuseppe R.
-- 
questo articolo e` stato inviato via web dal servizio gratuito 
http://www.newsland.it/news
 segnala gli abusi ad 
ab...@newsland.it

onsubmit devi mettere un return precarica(); ed uscire da precarica con
return false;
in misura, se tutto ok, fai un submit della form

 in misura, se tutto ok, fai un submit della form
ho aggiunto return, intendevi messo sul richimao della funzione??
nella form??
<script>
function precarica(){
nomeFile = myForm.myFile.value;
if (nomeFile=="") return;
// isolo l'estensione e verifico che sia fra quelle permesse
extFile=nomeFile.substr(nomeFile.lastIndexOf(".")+1);
permesse="#jpg#gif#bmp#png#";
if (permesse.indexOf("#"+extFile+"#")==-1) {
alert(extFile + " non e' un file permesso");
return;
} 
myImg.src = nomeFile; 
}
function misura(){
largo=myImg.width; 
alto=myImg.height; 
grosso=myImg.fileSize;
alert(largo+" x "+alto+" : "+grosso)
if ((largo > 200)){
alert ("immagine troppo grande!");
document.myForm.reset();
}
}
</script>
</HEAD>
<BODY>
<!-- ' -->
<form ENCTYPE="multipart/form-data" method="post" name=myForm
onSubmit='return precarica();'>
<input type=file name=myFile width=200" accept="image/*">
<INPUT TYPE="submit">
</form>
<img name=myImg style="visibility:hidden" onload="misura()">
ma ancora non và... c'è qualcosal'altro che potrei fare,,
Grazie ancora GIuseppe,


 }

Cristiano Larghi ha scritto:


Ciao  Cristiano, spero di no esasperarti, ma  ho fatto proprio così come
dicevi e ancora nada... 
<script>
function precarica(){
	nomeFile = myForm.myFile.value;
if (nomeFile=="") return;
return false;
// isolo l'estensione e verifico che sia fra quelle permesse
	extFile=nomeFile.substr(nomeFile.lastIndexOf(".")+1);
	permesse="#jpg#gif#bmp#png#";
	if (permesse.indexOf("#"+extFile+"#")==-1) {
		alert(extFile + " non e' un file permesso");
		return;
		return false;
	}  
	myImg.src = nomeFile; 
	turn false;
}
function misura(){
	largo=myImg.width; 
	alto=myImg.height; 
	grosso=myImg.fileSize;
	alert(largo+" x "+alto+" : "+grosso)
	if ((largo > 200)){
		alert("Attenzione!!!");
		document.myForm.reset();
	}
	document.forms['myForm'].submit();
}
</script>
<form ENCTYPE="multipart/form-data" method="post" name=myForm
onSubmit='return precarica();'>
<input type=file name=myFile width=200" accept="image/*">
<INPUT TYPE="submit">
</form>
<img name=myImg style="visibility:hidden" onload="misura()">
Dove sbaglio???
Ciao e ancora grazie della pazienza
giuseppe


 giuseppe
--
artemis.alpeia
--------------------------------
Inviato via 
http://arianna.libero.it/usenet/

 e poi... invii un form che hai appena resettato?
hai perfettamente ragione non mi serve, questa riga, seguivo i consigli di
Cristiano , ma non mi sarň spiegato bene.
Quello che voglio fare che a dire sembra semplice ma in pratica..(non gle
la faccio proprio) e solo questo:
Vorrei semplicemente mentre faccio l'upload cointrollare le dimensioni
delle immagine se č grande bloccare l'invio e far comparire il messaggio
di alert.
Sta cosa mi sta facendo impazzire....
Ora il mio script č cosě.. cosa manca secondo voi??
<script>
function precarica(){
	nomeFile = myForm.myFile.value;
if (nomeFile=="") return;
return false;
// isolo l'estensione e verifico che sia fra quelle permesse
	extFile=nomeFile.substr(nomeFile.lastIndexOf(".")+1);
	permesse="#jpg#gif#bmp#png#";
	if (permesse.indexOf("#"+extFile+"#")==-1) {
		alert(extFile + " non e' un file permesso");
		return false;
	}  
	myImg.src = nomeFile; 
	return false;
}
function misura(){
	largo=myImg.width; 
	alto=myImg.height; 
	grosso=myImg.fileSize;
	alert(largo+" x "+alto+" : "+grosso)
	if ((largo > 200)){
		alert("Attenzione!!!");
		document.myForm.reset();
	}
}
</script>
<form ENCTYPE="multipart/form-data" method="post" name=myForm
onSubmit='return precarica();'>
<input type=file name=myFile width=200" accept="image/*">
<INPUT TYPE="submit">
</form>
<img name=myImg style="visibility:hidden" onload="misura()">
Ciao Giuseppe


 document.myForm.reset();
Qua, come giustamente faceva notare artemis, manca un return (altrimenti fa
il reset ma poi sempre il submit())

Grazie Cristiano, grazie artemis ora il controllo va alla grande, ma per
quella legge che dice "se qualcosa va bene , c' ne sempre n'altra che va
male..."
be.. ora il controllo appunto và...
ma se il file è giusto non è troppo grande non mi invia, e come se non
funzionasse il submit anche quando l'immagine e più piccola di 200.
Come mai.
questo è lo scritp:
<script>
function precarica(){
	nomeFile = myForm.myFile.value;
if (nomeFile=="") return false;
// isolo l'estensione e verifico che sia fra quelle permesse
	extFile=nomeFile.substr(nomeFile.lastIndexOf(".")+1);
	permesse="#jpg#gif#bmp#png#";
	if (permesse.indexOf("#"+extFile+"#")==-1) {
		alert(extFile + " non e' un file permesso");
		return false;
	}  
	myImg.src = nomeFile; 
	return false;
}
function misura(){
	largo=myImg.width; 
	alto=myImg.height; 
	grosso=myImg.fileSize;
	if ((largo > 200)){
		alert("Attenzione immagine troppo grande!!!");
		document.myForm.reset();
		return false;
	}
}
</script>
<form ENCTYPE="multipart/form-data" method="post" name=myForm
action="giuseppe.php" onSubmit='return precarica();'>
<input type=file name=myFile width="200" accept="image/*">
<INPUT TYPE="submit">
</form>
<img name=myImg style="visibility:hidden" onload="misura()">
ciao


Manca il submit!!!
document.forms['myForm'].submit();

 document.forms['myForm'].submit();
fuochino (o meglio, e' un'altra candela!), manca il return true quando va
tutto bene! ^__________^
<script>
function precarica(){
	nomeFile = myForm.myFile.value;
        if (nomeFile=="") return false;
// isolo l'estensione e verifico che sia fra quelle permesse
	extFile=nomeFile.substr(nomeFile.lastIndexOf(".")+1);
	permesse="#jpg#gif#bmp#png#";
	if (permesse.indexOf("#"+extFile+"#")==-1) {
		alert(extFile + " non e' un file permesso");
		return false;
	}
	myImg.src = nomeFile;
	return true;
}
function misura(){
	largo=myImg.width;
	alto=myImg.height;
	grosso=myImg.fileSize;
	if ((largo > 200)){
		alert("Attenzione immagine troppo grande!!!");
		document.myForm.reset();
		return false;
	}
}
</script>
..al prossimo bug


 tutto bene! ^__________^
Enno...precarica viene eseguita onsubmit che deve sempre restituire false,
altrimenti non effettua il controllo "misura"...
è la function misura() che verifica onload dell'immagine e, se le dimensioni
sono appropriate, scatena il submit

Ciao ragazzi ho porvato entrambe le soluzioni, ora dove sbaglio?
<script>
function precarica(){
	nomeFile = myForm.myFile.value;
if (nomeFile=="") return false;
// isolo l'estensione e verifico che sia fra quelle permesse
	extFile=nomeFile.substr(nomeFile.lastIndexOf(".")+1);
	permesse="#jpg#gif#bmp#png#";
	if (permesse.indexOf("#"+extFile+"#")==-1) {
		alert(extFile + " non e' un file permesso");
		return false;
	}  
	myImg.src = nomeFile; 
	//return false;
	document.forms['myForm'].submit();
}
function misura(){
	largo=myImg.width; 
	alto=myImg.height; 
	grosso=myImg.fileSize;
	//alert(largo+" x "+alto+" : "+grosso)
	if ((largo > 200)){
		alert("Attenzione immagine troppo grande!!!");
		document.myForm.reset();
		return false;
	}
}
</script>
<form ENCTYPE="multipart/form-data" method="post" name=myForm
action="giuseppe.php" onSubmit='return precarica();'>
<input type=file name=myFile width="200" accept="image/*">
<INPUT TYPE="submit">
</form>
<img name=myImg style="visibility:hidden" onload="misura()">
giuro che non vi assillo piů!!
Ciao Giuseppe


 }
***************QUA VA IL SUBMIT************************

Cristiano Larghi ha scritto:


Perdon Cristiano, alla fine tutto ok (era ora me dirai)
Ti ringrazio veramente tanto.
ps: alla fine mi sono accorto che se cercavo di inviare un file grande
tutto andava ok, ma se dopo di questo cercavo di inviare un file giusto ,
non avveniva l'invio.
Ho risolto questo prooblema ricaricando la pagina anzichč resettare il
form, cosě:
function misura(){
   largo=myImg.width; 
   alto=myImg.height; 
   if ((largo > 200)){
     alert("Attenzione immagine troppo grande!!!");
     //document.formfile.reset();
     location.reload();
   return false;
   }
  document.forms['formfile'].submit();
}
Grazie ancora dell'aiuto.
Giuseppe Rubino


 Ti ringrazio veramente tanto.
Ma sbaglio o cosě funziona solo con IE...

> Ma sbaglio o così funziona solo con IE...
Può essere...io gli ho sistemato un problema, non ho verificato la
compatibilità

 compatibilità
Sì, sì, ma non ce l'avevo con te, io lo volevo far presente a lui e a me...
Ma poi ho fatto un po' di prove, visto che mi ha incuriosito la cosa...
e ho visto che accontenterebbe tutti se si trasformasse la stringa della
dir: "C:\..." in "file:///C:/..." evitando ".fileSize" supportato penso solo
da IE...
E una volta che si riesce a far funzionare la cosa, a livello server-side ti
arriva l'immagine in una variabile?!? Per curiosita' come funziona...

 arriva l'immagine in una variabile?!? Per curiosita' come funziona...
L'immagine viene inviata come qualsiasi altro file via form - post (lato
server puoi poi "leggere" il file/files ricevuti e salvarli)