2

I'm trying to send some data through ajax post, I tried serializ but I keep getting an error the filename doesn't exist. Form data

$('#send #submit').on('click', function(e){
  e.preventDefault();
  $.post( "send.php", $("#bend").serialize())
    .done(function( data ) {
      alert( "Data Loaded: " + data );
    });
});

When you click submit first thing I try is to get file size I get

Warning: getimagesize(): Filename cannot be empty 

$dateityp = GetImageSize($_FILES['datei']['tmp_name']);
user3026745
  • 19
  • 1
  • 5
  • 1
    possible duplicate of [How can I upload files asynchronously with jQuery?](http://stackoverflow.com/questions/166221/how-can-i-upload-files-asynchronously-with-jquery) – scrowler Dec 09 '13 at 22:02
  • standard ajax cannot do file uploads. if you're serializing a canvas image, it will be a normal POST form field, NOT part of $_FILES – Marc B Dec 09 '13 at 22:03

1 Answers1

2

You can convert to base64. One way to do that is to draw the image to a canvas and use .toDataURL.

You can pass the image to this function I found on google for a base64 encode:

function getBase64Image(img) {
    var canvas = document.createElement("canvas");
    canvas.width = img.width;
    canvas.height = img.height;
    var ctx = canvas.getContext("2d");
    ctx.drawImage(img, 0, 0);

    var dataURL = canvas.toDataURL("image/png");
    return dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
}

Then upload through AJAX like this:

$.ajax({
  type: "POST",
  url: "send.php",
  data: {image: img}
}).done(function( respond ) {
  console.log(respond);
});
Aaron
  • 3,195
  • 5
  • 31
  • 49