Javascript-форум - Загрузка файла и его просмотр

Вот сама форма

<img id='img'/>	
		<form name="uploadImage" id="uploadImage" enctype="multipart/form-data" action="index2.php?progress=<?php echo($uiq)?>" method="post" class="well">
			<label>Upload File</label>
			<input type="file" name="userImage" id="userImage" />
			<span class="badge badge-info" style="display:none;">0%</span>
			<input type="submit" class="btn btn-success" name="upload_image" id="upload_image" value="UPLOAD FILE" />
			<div class="progress" style="display:none;"><div class="bar" style="width:0%;"></div></div>
			<input type="text" name="text-field"/>
		</form>

Суть в том что при форма работает если действовать по следующим шагам, выбрать файл и нажать загрузить картинку , и картинка появляется на экране ,без перезагрузки, а я сейчас хочу сделать чтобы картинка сразу появлялась как только выбрана, т.е. убрать шаг в котором ты нажимаешь клавишу Загрузить выбранное фото.
Вот код PHP

if(isset($_GET['progress_key']) and !empty($_GET['progress_key'])){
$status = apc_fetch('upload_'.$_GET['progress_key']);
    echo $status['current']/$status['total']*100;	
exit;

а вот сам JS

$(document).ready(function(){
var randIDS = '<?php echo $uiq?>';
var loader;
// Add Hidden Field
var hidden = $("<input>");
hidden.attr({
name:"APC_UPLOAD_PROGRESS",
id:"progress_key",
type:"hidden",
value:randIDS
});

  /*$("form").submit(function(event){      
   });*/



$("#uploadImage").prepend(hidden);
$("#userImage").change(function(){
//$("#uploadImage").submit(function(){

var p = $("#uploadImage");
p.attr('target','tmpForm');

// creating iframe
if($("#tmpForm").length == 0){
var frame = $("<iframe>");
frame.attr({
name:'tmpForm',
id:'tmpForm',
action:'about:blank',
border:0
}).css('display','none');
p.after(frame);
}
// Start file upload
$.get("get_progress.php", {progress_key:randIDS, rand:Math.random()},
	function(data){
		var uploaded = parseInt(data);
		if(uploaded == 100){
			$(".progress, .badge").hide();			
			var filename=$('input[type=file]').val();			
			$('#img').attr('src','uploads/'+filename);
			clearInterval(loadLoader);			
		}
		else if(uploaded < 100)
		{				
		}
		if(uploaded < 100)
			loader = setInterval(loadLoader,100);
	});

var loadLoader = function(){
$.get("get_progress.php", {progress_key:randIDS, rand:Math.random()}, function(data)
{
var uploaded = parseInt(data);
if(uploaded == 100){	
			var filename=$('input[type=file]').val();			
			$('#img').attr('src','uploads/'+filename);
			clearInterval(loader);
}
else if(uploaded < 100)
{
$(".progress, .badge").show();
$(".badge").text(uploaded+"%");
var cWidth = $(".bar").css('width', uploaded+"%");
}
});
}
});});

У меня когда просто последовательные шаги, выбрать а потом загрузить всё работает, когда я попылся убрать шаг загрузить и грузить сразу после выбора, сервер почему-то не находит этот файл загруженный постоянно возвращает 0 байт.