Sir, I am using these codes

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>My Contacts</title>

<style type="text/css">

html {
overflow:auto;
}

body{
background-color:#e7f4fe;
}

#container {
margin: auto;
position:absolute;
background-color:#CFC;
padding:10px;
overflow:auto;
width:150px;
height:150px;
text-align:center;
border:1px solid #09F;
}

.hidden{
    display:none;
    }
</style>

     <body>

        <div id="container">

            <form action="<?php $_SERVER['PHP_SELF'] ?>" method="post" enctype="multipart/form-data">

            <img id="photo" width="100" height="100" src="http://www.w3schools.com/images/compatible_chrome.gif"     style="text-align: center;" /><br>

            <input type="file" name="file" id="file" value="PLEASE CHANGE YOUR IMAGE" class="hidden"></br>

            <a target="photo" onclick="document.getElementById('file').click();"><b>UPLOAD</b></a></br></br> 
            </form>
        </div>
    </body>
 </html>

When I press upload then this image selector appears

[IMG]http://i40.tinypic.com/16m4ozn.jpg[/IMG]

I want to show selected image in current div like shown in above image.

How it will be possible.

(I do not want to upload image in any folder or database, just want to displaly)

Please help

Recommended Answers

All 3 Replies

There's a working demo here on jsfiddle that you can take a look at and adapt to your needs. This allows you to display without actually uploading.

http://jsfiddle.net/LvsYc/

You can include a javascript function to it.

inside the function, give

document.getElementById('Id_of_div_whr_u_want2_display_the_img').innerHTML= file;
(ie, the img u hav selected)
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.