Getting the previous image as preview after uploading new image

[Rahul Das]

I am developing an application where I am uploading a file and then it is uploaded to a temporary folder and I see the preview of that image through an ajax call without refreshing the current page.Then after clicking "Save" it saves the file to original directory.
The file I am uploading is same as the user's login name and deleting the existing file with the same name before uploading.So the file I upload will not overwrite any file.

My problem is that when I am uploading a new file it is uploaded to the temporary directory with the same name but the preview image displays the previous image.After refreshing the page it displays the new image.
So what method should I follow or code should I add, so that the preview image will be updated with the updation of image.

Here is my php code that I execute with ajax call.

<?php
$upload_dir = 'd://Test_Projects/ecom/upload/';
$preview_url = 'http://localhost:8081/testprojects/ecom/upload/';
$fileTempName = $_SESSION['user_name'];
$result = 'ERROR';
$result_msg = '';
$allowed_image = array ('image/gif', 'image/jpeg', 'image/jpg', 'image/pjpeg','image/png');
define('PICTURE_SIZE_ALLOWED', 224288000); // bytes

if (isset($_FILES['picture']))  // file was send from browser
{
    if ($_FILES['picture']['error'] == UPLOAD_ERR_OK)  // no error
    {
        if (in_array($_FILES['picture']['type'], $allowed_image))
        {
            if(filesize($_FILES['picture']['tmp_name']) <= PICTURE_SIZE_ALLOWED) // bytes
            {
                $ext='jpg';
                $fileTempName = $fileTempName.'.'.$ext;
                
                $full  = "upload/";
                $fullFile = $full.$fileTempName;
                if(file_exists($fullFile))
                {
                    unlink($fullFile);
                }
               
                move_uploaded_file($_FILES['picture']['tmp_name'], $upload_dir.$fileTempName);
            }
            else
            {
                $filesize = filesize($_FILES['picture']['tmp_name']);// or $_FILES['picture']['size']
                $filetype = $_FILES['picture']['type'];
                $result_msg = PICTURE_SIZE;
            }
        }
        else
        {
            $result_msg = SELECT_IMAGE;
        }
    }
    elseif ($_FILES['picture']['error'] == UPLOAD_ERR_INI_SIZE)
    {
        $result_msg = 'The uploaded file exceeds the upload_max_filesize directive in php.ini';
    }
    else
    {
        $result_msg = 'Unknown error';
    }
}

// This is a PHP code outputing Javascript code.
echo '<script language="JavaScript" type="text/javascript">'."\n";
echo 'var parDoc = window.parent.document;';
if ($result == 'OK')
{
    echo "window.parent.document.getElementById('picture_error').innerHTML =  '';";
}
else
{
    echo "parDoc.getElementById('picture_error').innerHTML = '".$result_msg."';";
}

if($fileTempName != '')
{
    echo "window.parent.document.getElementById('profile_photo_div').innerHTML = '';";
    echo "window.parent.document.getElementById('profile_photo_div').innerHTML = '<img src=\'$preview_url$fileTempName\' id=\'preview_picture_tag\' name=\'preview_picture_tag\' width=\'660\' height=\'450\' />';";
}

echo "\n".'</script>';
exit(); // do not go futher

?>

Please solve it!
Thanks in Advance.......