Sunday, November 25, 2012

Form Upload Image

Now we will make from to upload image. You must have often upload your pictures to social network or to other website. Here we will learn make form for upload image. Let's follow steps below.


The first write script below at your text editor. And then save with name form_upload.php. Let's see script below.



<html>
<head>
<title>Form Uplod Image</title>
</head>
<body>
<h3>Form Upload Image</h3>
<form action="process_upload.php" method="post" enctype="multipart/form-data">
Name :<input type="text" name="name"/>
<br />
Image :<input type="file" name="image" />
<br />
<input type="submit" value="Upload"/>
</form>
</body>
</html>



Description of script above

Script below there is form attribute enctype use to send file via form. So file can be sent via form whit this attribite. And method form is POST. Action at this form is file process_upload.php.

<form action="process_upload.php" method="post" enctype="multipart/form-data">


Script below is use to make text field for input data. name of text field below is name.

<input type="text" name="name"/>


Script below is use to fill in the data file to this form. Data like file, image etc.

<input type="file" name="image" />


Below is script use to make submit button. The button is use to sent data in form.
<input type="submit" value="Upload"/>




Below is display of script above. Let's see...





Now we will make one file again to display output after sent from form. Write code below at your text editor and save with name process_upload.php like action form in file form_upload.php. Let's see script below.




<?php
echo"<h3>Process Upload Success!</h3>";
echo"<br />";
$name=$_POST['name'];
move_uploaded_file($_FILES['image'['tmp_name'],
"images/{$_FILES['image']['name']}");
echo"<img src=images/".$_FILES['image']['name']." hight='200' width='200'>";
echo"<br />";
echo"Name: ".$name;
?>





Description of script above

Script below is use to show text "Process Upload Success!" at upload image is success.

echo"<h3>Process Upload Success!</h3>";


Script below is use to catch value or data from text filed is named 'name'. variable $_POST as value placeholders of text field 'name'.

$name=$_POST['name'];


There is function in script below that is function move_uploaded_file is use to copy file from computer to server, and variable $_FILES as value placeholders of Image Submit Button with name 'image'.


move_uploaded_file($_FILES['image'['tmp_name'],
"images/{$_FILES['image']['name']}");



Script below is use to display image which is uploaded to server with size hight 200 pixel and width 200 pixel.

echo"<img src=images/".$_FILES['image']['name']." hight='200' width='200'>";


Script below is use to display data which is has been sent via form and variable $_POST catch value or data from textfield 'name' and then save value in variable $name.

echo"Name: ".$name;



Let's see output of script above after data has been sent.



If upload imgae is success file image penguins file should exist in the htdocs directory on the your folder. Let's see example below.




Tanks for visit and read my article... See you in my next article...



Learn and learn again...

No comments:

Post a Comment