CODEWITHSUNDEEP
javascriptandroidjqueryajaxcordova
Marco Cuccagna
Marco Cuccagna

Reputation: 105

Upload image with phonegap using ajax

I'm developing an application using phonegap, my app, capture an image from camera or gallery, i move to a specific folder and after that i want to upload it to a server. I upload some data too from a form. My problem is that everything works if i use an image from the gallery but it doesn't work if i capture it from camera. Here is my code js.

var pictureSource;   // picture source
var destinationType; // sets the format of returned value
document.addEventListener("deviceready",onDeviceReady,false);

function onDeviceReady() {
pictureSource=navigator.camera.PictureSourceType;
destinationType=navigator.camera.DestinationType;
}

function onPhotoDataSuccess(imageURI) {

var Image = document.getElementById('Image');
var form = document.getElementById('up');
var b1 = document.getElementById('b1');
var b2 = document.getElementById('b2');
Image.style.display = 'block';
form.style.display = 'block';
b1.style.display = 'none';
b2.style.display = 'none';
Image.src = imageURI;
movePic(imageURI);
}

function capturePhoto() {
// Take picture using device camera and retrieve image 
navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,
destinationType: destinationType.FILE_URI,
});
}

function getPhoto(source) {
navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,
    destinationType: destinationType.FILE_URI,
    sourceType: source    });
}

function onFail(message) {
alert('Failed because: ' + message);
}

/*****************save*****************/

function movePic(file){
  window.resolveLocalFileSystemURI(file, resolveOnSuccess, resOnError);
}
//Callback function when the file system uri has been resolved
function resolveOnSuccess(entry){
var d = new Date();
var n = d.getTime();
var newFileName = n + ".jpg";
var myFolderApp = "folder";
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function(fileSys) {
    //creo la cartella geofolder e salvo le foto scattate
   fileSys.root.getDirectory(myFolderApp,
            {create:true, exclusive: false},
            function(myFolderApp) {
                entry.moveTo(myFolderApp, newFileName,  successMove,                                            resOnError);
                document.forms['up'].foto.value = newFileName;

            },
            resOnError);
    },
    resOnError);
return newFileName;
}

//Callback function when the file has been moved successfully 
function successMove(entry) {
//Store imagepath in session for future use
// like to store it in database
sessionStorage.setItem('imagepath', entry.fullPath);
}

function resOnError() {
alert(error.code);
}

////upload///

$("#upload").click(function(){
    //some variable

    uploadimage(foto);
    $.ajax({
        type: "POST",
        url: "http://x.org/upload.php",
        data: {//some data from the form},
        success: function(responce){
            if(responce=='success')
            {
            alert('ok');
            }
            else
            {
            alert("errore");

            }
        }
    });
    return false;});

function uploadimage(foto) {

var Image = document.getElementById('Image').getAttribute("src");

var options = new FileUploadOptions();
options.fileKey="file";
options.fileName=foto;
options.mimeType="image/jpeg";

var params = new Object();
params.nome = "test";

options.params = params;
options.chunkedMode = false;

var ft = new FileTransfer();
ft.upload(Image, "http://x.org/uploadphoto.php", win,    fail, options);
}

function win() {
alert("ok bro");
}
function fail() {
alert("not bro");

}

Upvotes: 1

Views: 738

Answers (1)

Eros Scoppiato
Eros Scoppiato

Reputation: 89

the problem is in movePic() function:

you are trying to upload an uri that no longer exists because you move it!

try entry.copyTo() instead of 

entry.moveTo();

Upvotes: 1

Related Questions