recadrage et ajax téléchargement de l'image

Question

Je veux télécharger et recadrer une image via ajax.

S'il vous plaît suggérer comment je peux le faire.

Answer 1

Pour télécharger une image, vous aurez besoin du processus javascript traitant le téléchargement, il y a beaucoup de plugins pour le faire si vous utilisez la bibliothèque jquery. Pour gérer le processus de téléchargement, vous aurez besoin de script PHP. Vous envoyez une requête au script php à partir d'ajax et il effectue le téléchargement.

Pour recadrer l'image que vous avez besoin d'un outil de recadrage ou d'un script de culture est ici un endroit frais une http://www.webresourcesdepot.com/jquery-image-crop-plugin-jcrop/

Après avoir manipulé l'image recadrée vous devez exécuter le processus de téléchargement (php) par le plugin jquery Uploader, ou d'une autre jquery ou javascript ajax code.

Answer 2

Here is the code Jquery + PHP [Cake PHP] 

View file upload.ctp 

<script type="text/javascript" src="http://demos.9lessons.info/ajaximageupload/scripts/jquery.form.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
    $('#photoimg').on('change', function(){ 
    $("#preview").html(''); 
    $("#preview").html('<img src="/images/ajax-loader.gif" alt="Uploading...."/>'); 
    $("#imageform").ajaxForm({target: '#preview',success: showResponse}).submit(); 
    }); 

}); 


</script> 

<form id="imageform" method="post" enctype="multipart/form-data" action='/media/upload'> 
Upload image <input type="file" name="photoimg" id="photoimg" /> 
</form> 

<div id='preview'></div> 



create a function with name upload in Media controller 



    function upload(){ 
     $this->layout = ''; 

     $session_id='1'; // User session id 
     $path = "images/media/images/original/"; 
     $valid_formats = array("jpg", "png", "gif", "bmp","jpeg"); 

if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST"){ 
     //pr($_FILES);die; 
     //if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST"){ 
     $name = $_FILES['photoimg']['name']; 
     $size = $_FILES['photoimg']['size']; 
      if(strlen($name)) { 
      list($txt, $ext) = explode(".", $name); 
      if(in_array($ext,$valid_formats)){ 
       if($size<(1024*1024)) { // Image size max 1 MB 
       $txt=str_replace(" ","_",$txt); 
       $actual_image_name = $txt."_".time().".".$ext; 
       $tmp = $_FILES['photoimg']['tmp_name']; 
       App::import('Vendor', 'resize'); 
       if(move_uploaded_file($tmp, $path.$actual_image_name)) { //Code for image resize 
        //mysql_query("UPDATE users SET profile_image='$actual_image_name' WHERE uid='$session_id'"); 
        // save this to DB into Temp Selection table set USer wise and Capsule or individual Board wise 
        echo "<img src='/images/media/images/".$actual_image_name."' class='preview'><br/><a href='javascript:void(0);' id='upload_submit'>Submit</a>"; 
       } 
       else 
       echo "failed"; 
       } 
      else 
      echo "Image file size max 1 MB"; 
      } 
      else 
      echo "Invalid file fo`enter code here`rmat.."; 
      } 
     else 
     echo "Please select image..!"; 
     exit; 
     } 

    }