File doesn't always upload to server using PHP & Javascript -
i have page use have users press submit button insert mysql data capture image , upload .png file directory click of 1 submit button. 9/10 works perfectly. i'm not sure if it's connectivity issue (it's being done on wireless device) or if it's code. 1/10 times insert mysql data not upload image server. below upload code file , upload_data.php file code calls. sorry formatting on site isn't greatest.
<script> function uploadex() { var canvas = document.getelementbyid("canvassignature"); var dataurl = canvas.todataurl("image/png"); document.getelementbyid('hidden_data').value = dataurl; var fd = new formdata(document.forms["form"]); var xhr = new xmlhttprequest(); xhr.open('post', '/inc/img/inspection/upload_data.php', true); xhr.upload.onprogress = function(e) { if (e.lengthcomputable) { var percentcomplete = (e.loaded / e.total) * 100; console.log(percentcomplete + '% uploaded'); //alert('succesfully uploaded'); } }; xhr.onload = function() { }; xhr.send(fd); }; </script> below upload_data.php <?php $upload_dir = "upload/"; $img = $_post['hidden_data']; $img = str_replace('data:image/png;base64,', '', $img); $img = str_replace(' ', '+', $img); $data = base64_decode($img); $id = $_post['sub_id']; $file = $upload_dir . $id . ".png"; $success = file_put_contents($file, $data); print $success ? $file : 'unable save file.'; ?>
based on comment, not cancelling default submit event , cause form submitted. , cause ajax request not finish always.
if use inline javascript (i try move inline js script itself...), need make sure use like:
onsubmit="return uploadex();"
and
onclick="return uploadex();"
and in uploadex()
function end with:
function uploadex() { // code return false; }
Comments
Post a Comment