Polymer, submit a snapshot with ajax form
I am actually trying to send an image to my server, but it doesn't receive it.
My form:
<form is="ajax-form" action="../../../back/saveIMG.php" method="post" enctype="multipart/form-data">
<input type="file" name="pic" id="pic "accept="image/*">
<br/>
<input type="submit" name="submitInfo">
</form>
And my php script:
<?php
error_reporting(E_ALL | E_STRICT);
$target_dir = "uploads/";
$target_file = $target_dir . basename($_FILE["pic"]["name"]);
$uploadOk = 1;
$imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);
var_dump($_POST);
if(isset($_POST["submitInfo"])) {
$check = getimagesize($_FILE["pic"]["tmp_name"]);
if($check !== false) {
$uploadOk = 1;
} else {
$uploadOk = 0;
}
}
var_dump($uploadOk);
if ($uploadOk == 1) {
$res = move_uploaded_file($_FILE["pic"]["tmp_name"], $target_file);
var_dump($res);
}
? >
My script normaly run, I test it earlier, but it just gets an array of messages with the image name.
source to share
No JavaScript required. The file is uploaded and can be verified by viewing the network tab in the developer tools of your choice.
To get a handle presenting a PHP file: $_FILES['pic'];
. The file bytes will be saved in $_FILES['pic']['tmp_name']
. For more examples, see the Server Side PHP Fine Uploader , which handles files uploaded via an unrelated JavaScript library.
The Ajax form will submit the file just like a traditional form, provided the browser supports the File API. If you're using IE9 or older, you're out of luck.
While you can use a simple one <input type="file">
, you can also use an element <file-input>
. Disclaimer: I wrote <file-input>
, ajax-form element and Fine Uploader .
source to share