2012-05-17 3 views
1

에서 이미지를 업로드 할 때 진행률 표시 줄을 표시하는 방법이 내 코드입니다 :는 PHP

$(function(){ 

var btnUpload=$('#browse'); 
var adinfoid=$('#adinfoid').val(); 
new AjaxUpload(btnUpload, { 
    action: '<?php echo base_url()?>index.php/post/upload_editmainimage/'+adinfoid, 
    name: 'uploadfile', 
    onSubmit: function(file, ext){ 

     $("#progressid").css("display","block"); 
     if (! (ext && /^(jpg|png|jpeg|gif|JPG|PNG|JPEG|GIF)$/.test(ext))){ 
      $("#mainphotoerror").html('Only JPG, PNG, GIF, files are allowed'); 
      $("#mainphotoerror").css('display','block'); 
      return false; 
     }   
    }, 
    onComplete: function(file, response){ //alert(response); 

     if(response){ 
       /*$(".main_image").html(''); 
       $(".main_image").html(response);*/ 
       $("#progressid").css("display","none"); 
       $("#image"+<?php echo $mainimage->intphotoid; ?>).css('display','block'); 
       $("#imagemainicon"+<?php echo $mainimage->intphotoid; ?>).css('display','block'); 

       $("#mainimageicon").attr("src",response); 
       $("#mainimageicon").attr("width",55); 
       $("#mainimageicon").attr("height",55); 
       $("#mainimageicon1").attr("src",response); 
     }else{ 
     alert("error"); 
     } 
    } 
}); 

});

<input type="button" id="browse" class="browse_media" value="Browse"> 
     <div id="progressid" class="displayNone"> 
      <img src="//s3.amazonaws.com/s3.racingjunk.com/102/images/procesing.gif" width="117" height="20" /> 
      Uploading..... 
     </div> 

찾아보기 버튼을 클릭하면 5 분 동안 진행 막대가 표시됩니다. 5 분 후 진행 표시 줄이 숨겨 지거나 표시되지 않습니다. 진행률 표시 줄이 숨겨지면 이미지가 표시됩니다.

어떻게하면됩니까? 이것이 가능한가?

+0

두 가지 물어보기 -> "여기 업로드 할 때 진행률 표시 줄을 표시하고 싶습니다. ld not displayed "... 그러면"업로드가 끝난 후 5 분 후에 바를 표시하고 싶습니다. "(맞춤법 교정 내 ...) .... 무엇을하려고합니까? – ManseUK

+0

[Uploadify] (http://www.uploadify.com/)는 AJAX 업로드를위한 환상적인 솔루션입니다 ... – Lix

답변

0

당신은 코드를 사용하는 것은 당신이 공유 한 것을 달성 할 수 없다. 실제 진행 상황을 표시 할 수 있도록 서버에 얼마나 많은 데이터가 전송되었는지 알아야합니다.

사람들이 어떻게합니까? 1. Java Applet 또는 Flash와 같은 타사 플러그인을 사용하여 파일 을 업로드했습니다. 2. 파일 전송 중 진행 상황을 표시하기 위해 실제 그림을 사용합니다 (실제 진행 상태가 아님). 3. 그들은 당신이 (당신은 오래된 브라우저에있는 경우) 중 하나를 제 3 자 플러그인이 필요하거나 HTML5 XMLHttpRequest 객체 것이다 서버로 전송되어 얼마나 많은 파일에 대한 실시간 피드백을위한 HTML 5

를 사용

업로드 상태/진행 표시 줄이있는 html5 file upload을 참조하십시오.

1

이 같이 할 필요가 : - 스크립트에서

<div id="popup1" class="popup_block"> 
    <?php echo $this->Html->image('ajax-loader2.gif'); ?> 
    <h4>Processing Please Wait...! </h4> 
</div> 

: - 시간 당신이 당신의 jQuery를 포기 또는 다음과 같이 할 수에 대한 jQuery를

//Fade in Background 
      jQuery('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag. 
      jQuery('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer 
      var popID = 'popup1'; 
      //var popWidth = 500; 
      //Fade in the Popup and add close button 
      jQuery('#' + popID).css({ 'width': '250' }); 

를 사용 : -

window.setInterval(function() { 
    // this will execute every 5 minutes => show the alert here 
}, 300000);