Affichage de l'image après avoir cliqué sur télécharger

Comment afficher des images immédiatement après avoir cliqué sur le bouton de téléchargement?

Voici mon Code HTML:

form.php

<html>
<body>

<form action="uploadFile.php" method="post" enctype="multipart/form-data">
    <label for="file">Filename:</label>
    <input type="file" name="file" id="file"><br>
    <input type="submit" name="submit" value="Submit">
</form>

</body>
</html>

Et voici mon uploadFile.php code:(mise à jour, mais toujours pas à obtenir un résultat)

<?php
       //prevent timezone warnings
       date_default_timezone_set('Philippines/Manila');

      //set the upload location
      $UPLOADDIR = "images/";

        //if the form has been submitted then save and display the image(s)
    if(isset($_POST['Submit'])){
      //loop through the uploaded files
foreach ($_FILES as $key => $value){
    $image_tmp = $value['tmp_name'];
    $image_type=$value['type'];
    $image = $value['name'];
    $image_file = "{$UPLOADDIR}{$image}";

 //check if there's existing file name
  if ($image  != 0){
echo 'File Already Exists!';
}

  else {
    //move the file to the permanent location

  if(move_uploaded_file($image_tmp,$image_file)){

//this is where the displaying part goes
    echo <<<HEREDOC

    <div style="float:left;margin-right:10px">
        <img src="$editedShear" alt="This is your image" height=200 width=200/></br>
    </div>

HEREDOC;

    }
    else{
        echo "<h1>image file upload failed, image too big after compression</h1>";
         }
        }
}}
 else{
  ?>

<?php
 }
?>

vous devez utiliser une requête ajax pour cela , signifie que vous devez faire le téléchargement en utilisant ajax, et sur le succès, vous pouvez afficher l'image
Êtes-vous d'erreur ou de voir page vierge après les soumettre?
Non, juste une image brisée. Avec la description de l'image. C'est ce que j'obtiens après le bouton soumettre
Note de côté, et je sais que la question est âgé de quelques jours déjà, mais vous êtes en utilisant $editedShear comme la source de l'image, et de ne pas l'avoir déclaré n'importe où. Peut aider à activer les rapports d'erreur lorsque vous déboguez 🙂

InformationsquelleAutor user3335903 | 2014-02-21

php

0

Pour ce faire, vous devez télécharger l'image en utilisant une sorte de ajax upload. si vous ne savez pas ce qui est, s'il vous plaît lire ici http://en.wikipedia.org/wiki/Ajax_%28programming%29. Vous pouvez trouver quelques solutions gratuites et exemples en ligne. Ici, j'ai trouvé un débordement de pile question qui peut vous aider avec des liens vers de telles solutions

Ajax upload de fichier
- Merci pour l'info, mais vous pensez que ça va être plus complexe si j'utilise Ajax Upload de Fichier? Honnêtement, je pense que l'utilisation d'Ajax est beaucoup complexe que ce que je suis en train de faire. Mais encore, merci pour l'info. Je vais l'utiliser pour un usage futur. 🙂
InformationsquelleAutor Viktor Todorov
0

Télécharger votre image dans un dossier qui contient votre php/html fichier,
et dans la balise img écrire l'img nom:
```
<img src="<?php echo $img;?>" width="400" height="600"/>
```
- <img src="<?php echo $img;?>" width="400" height="600"/>
InformationsquelleAutor user4055477

/* i put image so that it has default

    <img id="blah" src="images/male.png" alt="your image" style="width:250px;height:200px;" />

/*put accept and its format so that you can only choose the image only

<input type='file' name="image"  onchange="readURL(this);" accept="image/gif,image/png,image/jpg,image/jpeg" />

/*changing the url of an image you can do it in jquery
function readURL(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();

            reader.onload = function (e) {
                $('#blah')
                    .attr('src', e.target.result)
/*set the width and height of an image
                    .width(250)
                    .height(200);
            };

            reader.readAsDataURL(input.files[0]);
        }
    }

après que faire de votre code de téléchargement

InformationsquelleAutor jundell agbo

Quelle est la manière la plus facile de télécharger des images et d'afficher les images téléchargées sur une même page?
la page "index.php"

HTML:

<body>
<div id="body">
	<form action="upload.php" name="img_compress" method="post" enctype="multipart/form-data">
	<input type="file" name="file" />
	<button type="submit" name="btn-upload">upload</button>
	</form>
    <br /><br />
    <?php
	if(isset($_GET['success']))
	{
		?><br><br><br>
        
    <?php
	$sql="SELECT * FROM tbl_uploads ORDER BY id DESC";
	$result_set=mysql_query($sql);
	while($row=mysql_fetch_array($result_set))
    {
		?>
     <img src="uploads/<?php echo $row['file'] ?>" width="100%" height="100%">
    <?php
}
	?>
   
        <?php
	}
	else if(isset($_GET['fail']))
	{
		?>
        <label>Problem While File Uploading !</label>
        <?php
	}
	else
	{
		?>
        <label>Try to upload any files(PDF, DOC, EXE, VIDEO, MP3, ZIP,etc...)</label>
        <?php
	}
	?>
</div>
</body>

code pour télécharger "upload.php"

HTML:

<?php
include_once 'dbconfig.php';
if(isset($_POST['btn-upload']))
{    
     
	$file = $_FILES['file']['name'];
    $file_loc = $_FILES['file']['tmp_name'];
	$file_size = $_FILES['file']['size'];
	$file_type = $_FILES['file']['type'];
	$folder="uploads/";
	
	$new_size = $file_size/1024;  
	
	$new_file_name = strtolower($file);
	
	$final_file=str_replace(' ','-',$new_file_name);
	
	if(move_uploaded_file($file_loc,$folder.$final_file))
	{
		$sql="INSERT INTO tbl_uploads(file,type,size) VALUES('$final_file','$file_type','$new_size')";
		mysql_query($sql);
		?>
		<script>
        window.location.href='index.php?success';
        </script>
		<?php
	}
	else
	{
		?>
		<script>
		alert('error while uploading file');
        window.location.href='index.php?fail';
        </script>
		<?php
	}
}
?>

ci-dessous est un des champs pour stocker des images
entrez la description de l'image ici

InformationsquelleAutor user7507414

0

Ajouter un iframe après votre formulaire:

<iframe name="resultFrame" width="500" height="300"></iframe>

Et ajouter le target="resultFrame" attribut dans votre formulaire, comme ceci:
```
<html>
    <body>    
        <form action="uploadFile.php" method="post"
enctype="multipart/form-data" target="resultFrame">
            <label for="file">Filename:</label>
            <input type="file" name="file" id="file"><br>
            <input type="submit" name="submit" value="Submit">
        </form>

        <iframe name="resultFrame" width="500" height="300"></iframe>

    </body>
</html>
```
- Ne pas afficher les images. Grâce à votre aide, BTW. 🙂
- Ce code fonctionne très bien mais je pense qu'il ya quelque chose de mal avec mon uploadFile.php fichier. Je ne sais pas ce que c'est. Je vais essayer de le réparer. Si vous avez une idée de comment. Tenez-moi au courant. Merci 🙂
InformationsquelleAutor Bamz3r

Vous devez vous connecter pour publier un commentaire.