Form per invio immagini

carlitosteam

Nuovo Utente
13 Apr 2008
24
0
0
Ciao ragazzi sto cercando di realizzare un form per l invio di immagini ma nn ne riesco a venir a capo
Praticamente partendo dalla pagina principale (index.php) e inserendo un form per l invio delle immagini vorrei che al click su invia stampasse a video
una gif contenente un immagine di attesa nella pagina madre(index.php)...e che alla fine dell upload dell immagine quest ultima venisse mostrata sempre nella pagina principale..(index.php)

Come devo procedere per realizzare la cosa ?
Grazie
 

alessandro1997

Utente Attivo
6 Ott 2009
5.302
1
0
26
Roma
alessandro1997.netsons.org
Di sicuro hai sbagliato sezione, andrebbe in PHP. Non è una cosa difficile, si può fare. Quindi tu vuoi che nella home vengano visualizzate tutte le immagini caricate? E dove devono essere salvata, in un database?
 

carlitosteam

Nuovo Utente
13 Apr 2008
24
0
0
Di sicuro hai sbagliato sezione, andrebbe in PHP. Non è una cosa difficile, si può fare. Quindi tu vuoi che nella home vengano visualizzate tutte le immagini caricate? E dove devono essere salvata, in un database?

Ciao Alessandro,si le immagini una volta finite di caricare devono visualizzarsi nella stessa pagina da cui e partita la richiesta...senza però aggiornare la pagina.Si le salvo su un database mysql,non credo che la cosa sia possibile usando solo il php...
 

carlitosteam

Nuovo Utente
13 Apr 2008
24
0
0
E perché no? Cosa c'è di quello che hai detto che non si può fare con PHP?

la chiamata asincrona...tipo invio e risposta del server nella stessa pagina da cui e partita la richiesta senza aggiornare la pagina...
Cioè se io carico un immagine da index.php...in modo dinamico alla fine del caricamento dell immagine dovrebbe visualizzarsi su index.php...ripeto senza che io aggiorni la pagina...non credo sia possibile solo con il php...o sbaglio?
 

carlitosteam

Nuovo Utente
13 Apr 2008
24
0
0
Ah, scusa, non avevo capito che tu volessi farlo in modo asincrono. Comunque penso che stia meglio in PHP, anche perché la maggior parte del lavoro è in quel linguaggio. Comunque dai un'occhiata a questo articolo e adattalo alle tue esigenze: http://www.alessioluffarelli.it/guide_tutorial/web/upload_file_immagini.php. Poi pensiamo alla parte AJAX. Se hai problemi fammi sapere! :)

La parte php già l ho strutturata....mi manca quella ajax...cioè vorrei fare in modo che nel div presente nella pagina da cui parte la richiesta venga visualizzato al termine del caricamento l immagine caricata..
E la parte ajax che mi manca:)
 

carlitosteam

Nuovo Utente
13 Apr 2008
24
0
0
Allora ho bisogno degli script che hai fatto fin'ora. Altrimenti come strutturo la parte AJAX?

EhEhE Giusto...ti accontento subito
Questa e la pagina con il form ovvero index.php
PHP:
<html>
<head>
<body>
<form  method="post" action="upload.php" enctype="multipart/form-data">	
<input type="hidden" size="1" name="MAX_FILE_SIZE" value="3000000000">
<input name="userfile" size="2" type="file">
 <br><input  type="submit" value="Aggiorna foto">
</form>
<div id="result">Qui dovrebbe mostrare l immagine caricata</div>
</form>


Questa e la pagina che elabora il tutto
PHP:
<?

include"config.php"; 




$dimensione_massima=2651200; //dimensione massima consentita per file in byte -> 1024 byte = 1 Kb
$dimensione_massima_Kb=$dimensione_massima/1024;
$cartella_upload="immagini/"; //cartella in cui eseguire l'upload (controllare permessi scrittura)
// percorso cartella relativo $cartella_upload="../public/";
$filtrare=1; //filtrare x estensioni ammesse? 1=si 0=no
$array_estensioni_ammesse=array('.jpg','.jpeg'); //estensioni ammesse

if(!isset($_FILES['userfile']) || $_FILES['userfile']['size']==0){
	echo "<script>alert(\"Nessun file selezionato per l'upload!\");
</script>";
}elseif($_FILES['userfile']['size']>$dimensione_massima){
	echo "<script>alert(\"Il file selezionato per l'upload supera dimensione massima di $dimensione_massima_Kb Kb\");
</script>";
}else{
	$nome_file=$_FILES['userfile']['name'];
	$errore="";
	if($filtrare==1){
		$estensione = strtolower(substr($nome_file, strrpos($nome_file, "."), strlen($nome_file)-strrpos($nome_file, ".")));
		if(!in_array($estensione,$array_estensioni_ammesse)){
			$errore.="<script>alert(\"Upload file non ammesso. Estensioni ammesse: ".implode(", ",$array_estensioni_ammesse)."\");
";
		}
	}
	if(!file_exists($cartella_upload)){
		$errore.="<script>alert(\"La cartella di destinazione non esiste\");
</script></br>";
	}
	
	if($errore==""){
		if(move_uploaded_file($_FILES['userfile']['tmp_name'], $cartella_upload.$_FILES['userfile']['name'])){
			chmod($cartella_upload.$_FILES['userfile']['name'],0777); //permessi per poterci sovrascrivere/scaricare
 



error_reporting(E_ALL);
$img = "immagini/$nome_file"; // percorso al file dell'immagine
$thumbs = "miniature/"; // directory di salvataggio delle miniature create
list($width, $height)  = getimagesize($img);
// dimensioni della miniatura da creare
$thumbWidth = 120; // larghezza
$thumbHeight = 100; // altezza
$thumbscale = min($thumbWidth / $width, $thumbHeight / $height);    
$new_width = floor($thumbscale * $width);
$new_height = floor($thumbscale * $height);
$tmp_img = imagecreatetruecolor($new_width, $new_height);
$image = imagecreatefromjpeg($img);
imagecopyresampled($tmp_img, $image, 0, 0, 0, 0, $new_width, $new_height, $width, $height);
imagejpeg($tmp_img, $thumbs."$nome_file", 100);
ImageDestroy($tmp_img);

echo"<img src=\"immagini/$nome_file\">
";

  }
	}else{
		echo $errore;
	}
}

?>
 

softhare

Utente Attivo
11 Feb 2010
57
0
0
Friuli
www.softhare.it
Ed il motore per il trasferimento asincrono dov'è?

Gli script pubblicati usano javascript solo per fini marginali.
Per un upload asincrono, con immagine di attesa, devi necessariamente utilizzare le tecniche XMLHTTP.
Il che implica un utilizzo approfondito di JavaScript.
Inotre per l'invio asincrono di un form multipart con file allegati dovrai probabilmente appoggiarti anche ad un frame o iframe, eventualmente invisibile) nel quale monitorare il completamento dell'upload.

Detto in altre parole, è moooolto più complesso del codice che hai inviato.
 

carlitosteam

Nuovo Utente
13 Apr 2008
24
0
0
Gli script pubblicati usano javascript solo per fini marginali.
Per un upload asincrono, con immagine di attesa, devi necessariamente utilizzare le tecniche XMLHTTP.
Il che implica un utilizzo approfondito di JavaScript.
Inotre per l'invio asincrono di un form multipart con file allegati dovrai probabilmente appoggiarti anche ad un frame o iframe, eventualmente invisibile) nel quale monitorare il completamento dell'upload.

Detto in altre parole, è moooolto più complesso del codice che hai inviato.
Ciao softhare,come ho già detto in precedenza nel codice che ho postato manca totalmente la parte Ajax,purtroppo e proprio quella che sto cercando di strutturare...da adattare al codice che hai visto,per la gif di attesa avevo pensato a un div invisibile che dovrebbe apparire al click sull invio del form,il problema e che nn so poi come far sparire quel div una volta che l immagine e caricata
 

softhare

Utente Attivo
11 Feb 2010
57
0
0
Friuli
www.softhare.it
Ed innerHTML?

Per me dovresti:

- nel form specificare come target un iframe nascosto (invisibile);
- quando l'utente invia il form inserire nel div "result" il gif di attesa (via javascript: result_handler.innerHTML="...";
- quando l'utente invia il form lo invia alla applicazione che processa l'immagine e restituisce, nell'iframe, solo "ok" oppure "errore";
- monitorare (via js) l'iframe e quando il contenuto diventa "ok" oppure "errore" agire di conseguenza, modificando nuovamente l' innerHTML del div result;

Non appesantirei la cosa con ulteriori div non necessari.
 

carlitosteam

Nuovo Utente
13 Apr 2008
24
0
0
Ho fatto cosi'...e pare che funzioni

HTML:
<iframe name="nascosto"  style="display:none"></iframe>
<form name="form1" method="post" action="upload.php" id="form1" target="nascosto"  enctype="multipart/form-data" >
<input type="hidden" size="1" name="MAX_FILE_SIZE" value="3000000000">
<input name="userfile" size="2" type="file">
 <br><input  type="submit" value="Invia" onclick="document.getElementById('attesagif').innerHTML='<img src=loader.gif>'">
 </form>

<div id="attesagif"></div>
<br>
<div id="content">
</div>

nella pagina php che elabora la richiesta ho fatto cosi'..
PHP:
<html>
<head>

<script type="text/javascript" src="ahah/ahahText.js"></script>

<?

include"config.php"; 




$dimensione_massima=2651200; //dimensione massima consentita per file in byte -> 1024 byte = 1 Kb
$dimensione_massima_Kb=$dimensione_massima/1024;
$cartella_upload="immagini/"; //cartella in cui eseguire l'upload (controllare permessi scrittura)
// percorso cartella relativo $cartella_upload="../public/";
$filtrare=1; //filtrare x estensioni ammesse? 1=si 0=no
$array_estensioni_ammesse=array('.jpg','.jpeg'); //estensioni ammesse

if(!isset($_FILES['userfile']) || $_FILES['userfile']['size']==0){
	echo "<script>alert(\"Nessun file selezionato per l'upload!\");
</script>";
}elseif($_FILES['userfile']['size']>$dimensione_massima){
	echo "<script>alert(\"Il file selezionato per l'upload supera dimensione massima di $dimensione_massima_Kb Kb\");
</script>";
}else{
	$nome_file=$_FILES['userfile']['name'];
	$errore="";
	if($filtrare==1){
		$estensione = strtolower(substr($nome_file, strrpos($nome_file, "."), strlen($nome_file)-strrpos($nome_file, ".")));
		if(!in_array($estensione,$array_estensioni_ammesse)){
			$errore.="<script>alert(\"Upload file non ammesso. Estensioni ammesse: ".implode(", ",$array_estensioni_ammesse)."\");
";
		}
	}
	if(!file_exists($cartella_upload)){
		$errore.="<script>alert(\"La cartella di destinazione non esiste\");
</script></br>";
	}
	
	if($errore==""){
		if(move_uploaded_file($_FILES['userfile']['tmp_name'], $cartella_upload.$_FILES['userfile']['name'])){
			chmod($cartella_upload.$_FILES['userfile']['name'],0777); //permessi per poterci sovrascrivere/scaricare
 



error_reporting(E_ALL);
$img = "immagini/$nome_file"; // percorso al file dell'immagine
$thumbs = "miniature/"; // directory di salvataggio delle miniature create
list($width, $height)  = getimagesize($img);
// dimensioni della miniatura da creare
$thumbWidth = 120; // larghezza
$thumbHeight = 100; // altezza
$thumbscale = min($thumbWidth / $width, $thumbHeight / $height);    
$new_width = floor($thumbscale * $width);
$new_height = floor($thumbscale * $height);
$tmp_img = imagecreatetruecolor($new_width, $new_height);
$image = imagecreatefromjpeg($img);
imagecopyresampled($tmp_img, $image, 0, 0, 0, 0, $new_width, $new_height, $width, $height);
imagejpeg($tmp_img, $thumbs."$nome_file", 100);
ImageDestroy($tmp_img);

echo"<img src=\"immagini/$nome_file\">
";

  }
	}else{
		echo $errore;
	}
}

?><script>
parent.document.getElementById("content").innerHTML = "<img src='immagini/<?echo"$nome_file";?>' width='450px' />";
parent.document.getElementById("attesagif").style.visibility = 'hidden';
</script>
Funzionare funziona perfettamente..soft secondo te può essere migliorato?
 

softhare

Utente Attivo
11 Feb 2010
57
0
0
Friuli
www.softhare.it
Tutto può venire migliorato: dipende dalle risorse che il committente è disposto ad investirci.

Esempi: invece di un gif qualsiasi, mettici una progression bar...
oppure fa sparire il form una volta usato e metti al suo posto la immagine inviata...

Non c'è limite all'ulteriore sviluppo di una applicazione.
 

carlitosteam

Nuovo Utente
13 Apr 2008
24
0
0
Tutto può venire migliorato: dipende dalle risorse che il committente è disposto ad investirci.

Esempi: invece di un gif qualsiasi, mettici una progression bar...
oppure fa sparire il form una volta usato e metti al suo posto la immagine inviata...

Non c'è limite all'ulteriore sviluppo di una applicazione.
Be...se al posto della gif usassi la progress bar sarebbe davvero il top...il problema è che non mi sono mai occupato delle progress bar e non so proprio come crearne una....potresti gentilmente darmiq ualche spunto di codice?
 

softhare

Utente Attivo
11 Feb 2010
57
0
0
Friuli
www.softhare.it
potresti gentilmente darmiq ualche spunto di codice?

Quanto a spunto, dovrai usare javascript per interrogare periodicamente un apposito script php sul server che restituisce il progresso dell'upload in corso.
Quindi lo javascript aggiorna il div con la progression, grafica o css o html come preferisci.
Chiaramente questo script dovrà venire eseguito solamente durante l'upload.

Richiede ottimo javascript per la parte client ed ottimo php per la parte server + ore di lavoro.

No, scusa ma non posso farlo a titolo di cortesia.
Come dicevo ci vogliono "risorse"....
 
Discussioni simili
Autore Titolo Forum Risposte Data
M Unire 2 funzioni per l'invio di un form e con l'apertura di un div Javascript 0
U PHP bottone per invio mail o ritorno al form PHP 15
C Come posso integrare il bottone "paga adesso" di paypal e un form php per invio dati? PHP 1
B Problema form mail per invio doppio allegato PHP 1
A Problema orario invio mail per form PHP 4
L Aiuto per ultimazione form invio email PHP 3
T form per invio mail PHP 38
P Form per invio mail PHP 27
P ASP form invio dati + file per email Classic ASP 4
G Aiuto per creare un form di invio file Classic ASP 3
M Collegare iframe e form per l'invio Javascript 3
L form immagini per il database PHP 0
T [PHP] Creare Honeypot per form contatti PHP 10
D [WordPress] come fare per estrarre dati da un db MySQL tramite una form e visualizzare il risultato WordPress 0
I Guida/Tutorial configurare PHPMailer per inviare mails tramite contact form? PHP 2
M [PHP] Framework per form complessi (configuratore prodotto) PHP 6
S [PHP] Aiuto creazione form php per completamento modello word PHP 1
Z [MySQL] Campi corretti per form... MySQL 2
sandropochi [PHP] Form per creare filtro di ricerca su DB PHP 8
K [WordPress] Plugin per inserire un form per la ricerca in un database.. come si fa? WordPress 1
U [PHP] form per ricerca multipla: Unknown column 'undefined' in 'where clause' PHP 2
S Concatenare due campi di un form per creare un indirizzo web valido Javascript 7
xone Form completo Testi + multiple image per inserimento Annunci PHP 0
A Form per modifica record database PHP 9
F aiuto per funzionamento sito responsive e form contatti HTML e CSS 29
elpirata Idee per personalizzare form HTML e CSS 9
L errore mysql per form di registrazione PHP 3
E Correzione per form PHP/HTML PHP 3
P Recupero dati per select form PHP 9
A consiglio uso jquery php per mostrare parte di un form PHP 6
A consiglio uso jquery per mostrare parte di un form jQuery 0
A Aiuto per Select form dinamica PHP 0
L come passare il campo allegato dal file html al fiel php per spedirlo con un form PHP 12
S Form per mandare la mail HTML e CSS 2
M [risolto] Script ajax per form e mappe Ajax 6
B aiuto per Form di eliminazione record PHP 21
asevenx form per formattare testo e inserirlo in databse PHP 1
U form mail per inviare tracciabilità corriere PHP 0
F Controlli form per Registrazione utenti PHP 9
A Pulsante per compilare una form php in automatico con dati presi da un db PHP 6
F Crear un form Contatti, per un Bed&Breakfast, dinamico, con Wordpress WordPress 3
A form in php o html per raccolta mail PHP 4
A da dove incominciare per fare vari form PHP 2
M Problema con form per accesso area riservata ai soci PHP 2
P Form per ricerca multipla in MYsql PHP 2
A problema con un semplice form per un loggin in php PHP 2
M Sicurezza dati form per insert e select in database PHP 11
C Aiuto per form PHP 5
A Aiuto per form email con allegato PHP 4
YellowMan Form mail per WordPress in italiano WordPress 2

Discussioni simili