Question

I need an image upload system within the page so that a user can upload a picture without leaving the profile editing page. Like it does in soundcloud when a user edits their profile. The picture should be uploaded and then should show up on the profile editing page once uploaded. Everything is written in PHP but im guessing some javascript will have to be in there. If there is something already like this that i can just utilize please let me know.

Here is the profile edit code

$username = $_SESSION['username'];
    $pass = $_SESSION['password']; 
  include ("../database.php");
   $result = mysql_query("SELECT * FROM members WHERE username='$username' AND     password='$pass' AND artist='Y'");

while($row = mysql_fetch_array($result)){

$artisturl = mysql_query("SELECT * FROM members  
WHERE username='$username' AND password='$pass'  AND artist='Y'");

while($row = mysql_fetch_array($artisturl)){
echo '<form action="phpscripts/artistupdate.php" method="post">
<input type="text" name="artistname" value="'. $row['artistname'].'" class="name"    maxlength="80"><span id="editlink"><t1>Your profile link will be: <br><a    href="http://newbornsounds.co.uk/artists/artist.php?artist='.$row['artistname'].'">    <b>http://newbornsounds.co.uk/artists/artist.php?artist=<FONT
 style="BACKGROUND-COLOR: yellow">'.$row['artistname'].'</font></b></a></span>
 <br><div id="urlwarn"><t1>Please note that if you change your url all the links you     have placed outside of NBS will be affected.</t1></div>';
}
}
?>
<hr>
<?php 


    $username = $_SESSION['username'];
    $pass = $_SESSION['password']; 
   include ("../database.php");
   $result = mysql_query("SELECT * FROM members WHERE username='$username' AND     password='$pass' AND artist='Y'");

while($row = mysql_fetch_array($result)){

       echo '<div id="artistsbio"><form action="phpscripts/artistupdate.php"    method="post">
       <textarea name="bio" rows="10" cols="80" name="bio" value="'.    $row['bio']. '" class="bio">'. $row['bio']. '</textarea><br>
       <div id="probwarn"><t1>Everything is still in the beta stage so there are bound to be a few problems. If you spot one please <a href="mailto:[e-mail]"><b>tell us about it.</b></a></t1></div>

       </div>';

}
?>

<a href="upload.html"><div id="imageright1edit"><img src="<?php  
   include ("../database.php");
   $result = mysql_query("SELECT * FROM members WHERE username='$username' AND     password='$pass' AND artist='Y'");

 while($row = mysql_fetch_array($result)){ echo ''. $row['image1'].''; }?>" width="100%"></a>
<a href="upload.html"><div id="imageright1edit"><img src="<?php  
   include ("../database.php");
   $result = mysql_query("SELECT * FROM members WHERE username='$username' AND    password='$pass' AND artist='Y'");

while($row = mysql_fetch_array($result)){ echo ''. $row['image2'].''; }?>" width="100%"></div></a>

<!-- This is the image upload select box-->
<input type="file" name="imageupload" value="Upload an image" class="filebutton"></div>

<input type="submit" name="submit" value="Done" class="button"></form>

Answer 1

• https://github.com/blueimp/jQuery-File-Upload
• http://www.uploadify.com/