Using cordova-plugin-camera, I'm able to call the device camera and take a photo, but I can't figure out what to do from there. I want to submit the photo taken to a form and upload it to my server using javascript. Here is an example of my code:
<html>
<script>
function capturePhoto() {
navigator.camera.getPicture(onPhotoDataSuccess, onFail, {
quality: 50,
correctOrientation: true,
destinationType: Camera.DestinationType.FILE_URI,
targetWidth: 100,
targetHeight: 100
});
}
function onPhotoDataSuccess(imageData) {
// Uncomment to view the base64 encoded image data
alert("Success: " + imageData);
}
function UploadUserImage(){
if($("#selectStudentImage").val() == ""){
return;
} else{
ShowHideBigLoading();
var fileName = "";
var fileExtension = "";
fileName = $("#selectStudentImage").val();
fileExtension = fileName.substr((fileName.lastIndexOf('.') + 1));
fileExtension = fileExtension.toLowerCase();
//Checking the file size
if($("#selectUserImage")[0].files[0].size > 20000000){
navigator.notification.alert("File size is too large to upload.", null, 'Error', 'Okay');
return;
}
//Checking to make sure that the file name is not too long
if(fileName.length > 100){
navigator.notification.alert("File name is too large. Please reduce the files name and try again.", null, 'Error', 'Okay');
return;
}
if($.inArray(fileExtension, ["doc","docx","jpg","jpeg","png","pjpeg","txt","gif","pdf"]) == "-1"){
navigator.notification.alert("File Type Unsupported", null, 'Error', 'Okay');
return;
}
setTimeout(function(){
$("#form_UploadEditUserPhoto").submit();
},500);
return;
}
}
</script>
<button onclick="capturePhoto();">Take Photo</button>
<form style="display: block; position: absolute;" action="" name="form_UploadEditUserPhoto" id="form_UploadEditUserPhoto" enctype="multipart/form-data" method="post" class="form-horizontal">
<input type="hidden" name="FormName" value="EditUserPhoto" />
<input style="display: none;" id='selectUserImage' name="file" type="file" onchange="return UploadUserImage(event)">
</form>
</html>
Any help would be very much appreciated. I also have ajax available for uploading an image, if there is not a way to do it by form.