Вот сама форма
<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 байт.