Need Help Editing an Image Upload Script

Discussion in 'JavaScript' started by scottlpool2003, Oct 1, 2012.

  1. #1
    I need an image uploader that uploads images without refreshing the page.

    I had some trouble finding one that is compatible with Apple as most use Flash or iFrames.

    I finally found one here: http://www.webinfopedia.com/upload-image-using-PHP-ajax.html which works really well.

    What I'm having trouble with is adding a timestamp to the image to keep the names unique.

    Upload Code:
    <?php
    $uploaddir = './images/'; 
    //Create a random digit using time to create unique image name
    $random_digit=time();
    $file = $uploaddir ."$random_digit".basename($_FILES['uploadfile']['name']); 
    $file_name= "$random_digit".$_FILES['uploadfile']['name']; 
     
    if (move_uploaded_file($_FILES['uploadfile']['tmp_name'], $file)) { 
      echo "success"; 
      echo "$random_digit";
    } else {
    	echo "error";
    }
    ?>
    
    PHP:
    When I output the image in this code:
    <script type="text/javascript" >
    	$(function(){
    		var btnUpload=$('#me');
    		var mestatus=$('#mestatus');
    		var files=$('#files');
    		new AjaxUpload(btnUpload, {
    			action: 'uploadPhoto.php',
    			name: 'uploadfile',
    			onSubmit: function(file, ext){
    				 if (! (ext && /^(jpg|png|jpeg|gif)$/.test(ext))){ 
                        // extension is not allowed 
    					mestatus.text('Only JPG, PNG or GIF files are allowed');
    					return false;
    				}
    				mestatus.html('<img src="ajax-loader.gif" height="16" width="16">');
    			},
    			onComplete: function(file, response){
    				//On completion clear the status
    				mestatus.text('Photo Uploaded Sucessfully!');
    				//On completion clear the status
    				files.html('');
    				//Add uploaded file to list
    				if(response==="success"){
    					$('<li></li>').appendTo('#files').html('<img src="images/$randomdigit'+file+'" alt="" height="120" width="130" /><br />').addClass('success');
    				} else{
    					$('<li></li>').appendTo('#files').text(file).addClass('error');
    				}
    			}
    		});
    		
    	});
    </script>
    PHP:
    All I am outputting is the image name without the $randomdigit.

    Is there any way I can pass the randomdigit variable with the image name? I'm not awfully familiar with JS or Ajax...

    Thanks.
     
    scottlpool2003, Oct 1, 2012 IP