PHP - Upload Picture and Display on Page

PHP - Upload picture and display on page

Well after you upload it, you can use javascript to put it on the html page.

I'm not quite sure what your question is, though

EDIT:

So, html form on your page:

<form action="imageUpload.php" method="post" enctype="multipart/form-data" target="upload_target"  onsubmit="jupload();"  id="form1" >
<div style="visibility:'hidden';" class="imageholder"> <!-- a gif image to show that the process wasn't finished -->
</div>
<input type="file" name="imgfile" />
<input type="submit" name="uploadButton" class="upbtn" value="Submit" />
</form>

Javascript(JQUERY) code for the upload and image add:

function jupload()
{
$(".imageholder").append('<img src="./images/loading.gif">');
}

function juploadstop(result)
{
if(result==0)
{
$(".imageholder").html("");

}
// the result will be the path to the image
else if(result!=0)
{
$(".imageholder").html("");
// imageplace is the class of the div where you want to add the image
$(".imageplace").append("<img src='"+result+"'>");
}
}

php code:

<?php
$target = "http://www.mockcourt.org.uk/user/htdocs/pics/2012/";
$target = $target . basename( $_FILES['uploaded']['name']) ;
$ok=1;

if (move_uploaded_file($_FILES['uploaded']['tmp_name'], $target))
{
$result=$target;
}
else
{
$result=0;
}
?>

<script language="javascript" type="text/javascript">
window.top.window.juploadstop(<?php echo $result; ?>);
</script>

Upload Image and Display on Separate Page Using PHP

In order to make your image accessible, it needs to be copied to your project's directory.

Let's say you want to copy it to the images directory, relative to the script. Make sure your images directory exists.

$uploadedFile = $_FILES['reunionPhoto'];
$sourcePath = $uploadedFile['tmp_name'];
$destinationFileName = $uploadedFile['name'];
$destinationPath = __DIR__ . '/images/' . $destinationFileName;

move_uploaded_file($sourcePath, $destinationPath);

Then, in your <img> you can display that image.

How to upload photo and display in folder and page using php?

<?php
$dir = './';
$name = $_FILES['image']['name'];
$fullpath = $dir.$name;
$extension = pathinfo($name, PATHINFO_EXTENSION);
$tmpFilename = pathinfo($name, PATHINFO_FILENAME);
$i = 1;

while(file_exists($fullpath)){
$_FILES['image']['name'] = $tmpFilename.'('.$i.')'.$extension;
$fullpath = $dir.$_FILES['image']['name'];
$i++;
}
move_uploaded_file($_FILES('image']['tmp_name'], $fullpath);
?>

In your form action attribute put:

upload_photo.php

Upload multiple image files and display on the next page. PHP

From php manual, to find here: http://php.net/manual/en/features.file-upload.multiple.php

   <form action="example_userinput2.php" method="post" enctype="multipart/form-data">
Send these files:<br />
<input name="userfile[]" type="file" /><br />
<input name="userfile[]" type="file" /><br />
<input type="submit" value="Send files" />
</form>

On page2, you can continue with a loop and handle those files at once:

foreach ($_FILES['array_of_files'] as $position => $file) {
// should output array with indices name, type, tmp_name, error, size
var_dump($file);
}

You can do the same as with one file in the loop

PHP and JS - upload picture not showing

You can do that using java script but there's no need for that. Easiest way is with few lines of PHP. Change name of your file from index.html into index.php so you can use PHP in that file.

In your index.php file add this code after you close your form:

<br>
HERE ARE YOUR UPLOADED IMAGES:
<br>
<?php
$dirname = "uploads/";

$images = glob($dirname."*{jpg,png,gif}", GLOB_BRACE);

foreach($images as $image) {
echo '<img src="'.$image.'" /><br />';
}
?>

<br>

This lines will show all images from uploads folder.

So you will have something like this:

<!DOCTYPE html>
<html>
<head>
<script language= "javascript" type="text/javascript">
function juploadstop(result){
console.log(typeof result);
if(result==0){
$(".imageholder").html("");
}
else if(result!=0){
$(".imageholder").html("<img src='"+result+"'>");
}
}
</script>
</head>

<body>
<form action="upload.php" method="post" enctype="multipart/form-data">
<div class="imageholder"> <!-- a gif image to show that the process wasn't finished -->
</div>
Select image to upload:
<input type="file" name="fileToUpload" id="fileToUpload">
<input type="submit" value="Upload Image" name="submit">
</form>
<br>
HERE ARE YOUR UPLOADED IMAGES:
<br>
<?php
$dirname = "uploads/";

$images = glob($dirname."*{jpg,png,gif}", GLOB_BRACE);

foreach($images as $image) {
echo '<img src="'.$image.'" /><br />';
}
?>

<br>

</body>
</html>

You will also need to add in your upload.php file at the end:

header('Location: index.php');

Make sure to add this before you close PHP tag there.This line will always redirect you on your index page.

Hope this is helpful for you!

Uploading Image in PHP page

You have to first upload successfully to the folder then you can add record in to your database

<?php

if(isset($_POST['submit'])) {

// This is the directory where images will be saved
$target = "images/";
$target = $target . basename( $_FILES['image']['name']);

// This gets all the other information from the form
$filename = basename( $_FILES['image']['name']);
$team_name = $_POST['team_name'];

// Write the file name to the server
if(move_uploaded_file($_FILES['image']['tmp_name'], $target)) {

//Tells you if its all ok
echo "The file ". basename( $_FILES['image']['name']). " has been uploaded, and your information has been added to the directory";

// Connects to your Database
// mysql_connect("localhost", "root", "") or die(mysql_error()) ;
// mysql_select_db("your_db") or die(mysql_error()) ;

//Writes the information to the database
// mysql_query("INSERT INTO picture (image, team_name)
// VALUES ('$filename', '$team_name')") ;

} else {
//Gives and error if its not
echo "Sorry, there was a problem uploading your file.";
}
}

?>

Your HTML should be

<form action="" method="post" enctype="multipart/form-data">
Select image to upload:
<input type="file" name="image" id="image">
<input type="text" name="team_name" id="team_name">
<input type="submit" value="Submit" name="submit">
</form>

Refer https://github.com/aslamanver/nbaTest

.php how to display an image that I can change and stock on my directory

SOLUTION I'VE FOUND
inspired from that page
How to upload & Save Files with Desired name

<form action='' method='POST' enctype='multipart/form-data'>
<input type='file' name='userFile'><br>
<input type='submit' name='upload_btn' value='upload'>
</form>

<?php
$info = pathinfo($_FILES['userFile']['name']);
$ext = $info['extension']; // get the extension of the file
$newname = "newname.".$ext;

$target = 'images/'.$newname;
move_uploaded_file( $_FILES['userFile']['tmp_name'], $target);
?>

<img src="images/newname.png">

clean and efficient ! works well !



Related Topics



Leave a reply



Submit