2011-09-25 3 views
1

HTML5 끌어서 놓기를 구현하여 파일을 업로드하려고합니다. 파일이 삭제되면 삭제 된 파일을 처리하기 위해 PHP 파일을 호출하려고합니다. 어떻게하면 PHP 파일을 호출하고 PHP 파일에서 드래그 파일에 액세스 할 수 있습니다. 또한, PHP 파일에서 성공 또는 오류 메시지를 다시 보내려고합니다.HTML5 끌어서 놓기 질문

어떻게 파일을 PHP에 게시하고 거기에서 응답을 얻을 수 있는지 알 수 없습니다. 내 코드는 지금까지 있습니다 :

<?php 
    $dropped_file //how to get the file 

    if (filesize($dropped_file) > 1024) 
    { 
     echo "size error" //how to send this error 
    } 
    else 
    { 
     echo "success"  //how to send this success msg. 
    } 
?> 

답변

0

드롭 콜백에, jQuery를 사용할 수있는 AJAX 호출을 수행

function drop(evt) { 
     evt.stopPropagation(); 
     evt.preventDefault(); 

     var files = evt.dataTransfer.files; 
     handleFiles(files); 
    } 

    function handleFiles(files) { 

     var file = files[0];  
     var reader = new FileReader(); 

     reader.onload = uploadFile; //main function 
     reader.onloadend = uploadComplete; 
     reader.readAsDataURL(file); 
    } 

    function uploadFile(evt) 
    { 
     //call upload.php 
     //get success msg or error msg 
     //alert(success) or alert(error) 
    } 

여기에 파일 upload.php로 예제 .

$("body").droppable({ 
    accept: "img", //Your element type goes here e.g. img 
    drop: function(event, ui){ 
     //Perform an AJAX call here. You can access the current dropped item through 
     //ui.draggable 
    } 
)} 
+1

에 드롭 할 수있는 기능을 제공 할 것입니다. 매우 가볍고 깨끗한 솔루션이 많이 있습니다. – Bojangles

-1

는 사용 jQuery를 UI는 당신에게 끌어 가장 쉬운 방법 나는 이것에 대한 jQuery를 UI를 사용하는 것이 좋습니다 않을 것

+0

이것은 유용한 답변이 아닙니다. jQuery UI에 드래그 앤 드롭을 수행하는 데 훌륭한 기능이 있다고 생각된다면 최소한 문서에 대한 링크 만 있으면됩니다. – nickf