承诺和上传数据

Question

我在网上发送表格或在本地保存表格时遇到了一些问题。我有一个Phonegap应用程序，它只是一个简单的表单，可以保存到数据库，或者如果失败，则在本地。

我只有这个功能才能完成所有工作。首先，我想，我只是与Boooleans一起做，运行功能，如果一切顺利，返回True。但这不起作用，因为代码只是在我有一个比较值之前执行，这意味着该值总是为假。

这是现在的代码：

if(uploadDataAndImage(formData))
{
 //Its true, do my things
}
else
{
//Its false
}

这是布尔函数：

function uploadDataAndImage(dataForm) {

                var localURL = dataForm.cardurl;
                console.log(localURL);

                if(localURL == "")
                {
                    $$.ajax({
                        type: "POST",
                        url: "upload.php",
                        crossDomain: true,
                        data: dataForm,
                        success:function(data)
                        {
                            console.log("Upload to server without card");
                            return true;
                        },
                        error: function()
                        {
                            console.log("Form couldn't upload to the server");
                            //alert("Couldnt upload to server, saving locally");
                            return false;
                        }
                    });

                }
                else{
                    //set upload options
                    var options = new FileUploadOptions();

                    options.chunkedMode = false;

                    console.log("Start upload picture");

                    var ft = new FileTransfer();
                    ft.upload(deLokaleURL, encodeURI("uploaderino.php"), win, fail, options);

                    function win(r) {
                        console.log("Code = " + r.responseCode);
                        console.log("R" + r.response);
                        console.log("Sent = " + r.bytesSent);

                        dataForm.cardurl = r.response;
                        var dataString = JSON.stringify(dataForm);



                        $$.ajax({
                            type: "POST",
                            url: "upload.php",
                            crossDomain: true,
                            data: dataForm,
                            success:function(data)
                            {
                                console.log("Upload to server with card");
                                return true;
                            },
                            error: function()
                            {
                                console.log("Form couldn't upload to the server, do nothing");
                                return false;

                            }
                        });



                    }

                    function fail(error) {
                        //alert("An error has occurred: Code = " + error.code);
                        console.log("An error has occurred: Code = " + error.code);
                        console.log("upload error source " + error.source);
                        console.log("upload error target " + error.target);


                        showMessage("Image upload has failed, get a better internet connection and try again!" , function(){console.log("Upload van de form is mislukt!")});
                        return false;

                    }
                }



            }

但这显然不起作用。现在我做了一些研究并询问了问题，我找到了Promises。但我似乎无法掌握如何使用它。

我想到这样的事情：

var deferred = $.Deferred();

                deferred.resolve(uploadDataAndImage(formData));

                deferred.done(function(value) {
                  //Upload went well so do my things
                });

但这不是它的工作方式，对吧/？

Answer 1

在uploadDataAndImage中使用deferred返回一个promise。然后，您可以使用then（）和catch（）在ajax调用完成时执行某些操作。

function uploadDataAndImage() {
  var deferred = $.Deferred();

  $$.ajax({
    type: "POST",
    url: "upload.php",
    crossDomain: true,
    data: dataForm,
    success:function(data) {
      deferred.resolve();
    }, error: function(e) {
      deferred.reject(e);
    }
  });

  return deferred.promise;
}

uploadDataAndImage(formData).then(function() {
  //Its true, do my things
}).catch(function() {
  //Its false
});

Answer 2

我只是将其设置为使用callBack功能。这样的事可能

uploadDataAndImage(formData, function(data){
     console.log(data);
     if(data){
         //do something in here that needs doing as the ajax call was true
     }
     else
     {
        //Do something after the ajax returned an error...
     }
})

function uploadDataAndImage(dataForm, callBack) {

                var localURL = dataForm.cardurl;
                console.log(localURL);

                if(localURL == "")
                {
                    $$.ajax({
                        type: "POST",
                        url: "upload.php",
                        crossDomain: true,
                        data: dataForm,
                        success:function(data)
                        {
                            console.log("Upload to server without card");
                            callBack(true);
                        },
                        error: function()
                        {
                            callBack(false);
                        }
                    });

                }
                else{
                    //set upload options
                    var options = new FileUploadOptions();

                    options.chunkedMode = false;

                    console.log("Start upload picture");

                    var ft = new FileTransfer();
                    ft.upload(deLokaleURL, encodeURI("uploaderino.php"), win, fail, options);

                    function win(r) {
                        console.log("Code = " + r.responseCode);
                        console.log("R" + r.response);
                        console.log("Sent = " + r.bytesSent);

                        dataForm.cardurl = r.response;
                        var dataString = JSON.stringify(dataForm);



                        $$.ajax({
                            type: "POST",
                            url: "upload.php",
                            crossDomain: true,
                            data: dataForm,
                            success:function(data)
                            {
                                callBack(true);
                            },
                            error: function()
                            {
                                callBack(false);

                            }
                        });



                    }

                    function fail(error) {
                        //alert("An error has occurred: Code = " + error.code);
                        console.log("An error has occurred: Code = " + error.code);
                        console.log("upload error source " + error.source);
                        console.log("upload error target " + error.target);


                        showMessage("Image upload has failed, get a better internet connection and try again!" , function(){console.log("Upload van de form is mislukt!")});
                        return false;

                    }
                }



            }

你可以玩你想要的功能，我不能100％确定你想要的东西:)但是你在函数中放入的任何东西都会在ajax调用完成后执行

Answer 3

您可以使用承诺，例如：

uploadDataAndImage(formData)
    .done(function(){
        // Its true, do my things
    }).fail(function(){
        //Its false
    });

function uploadDataAndImage(dataForm) {
    var deferred = $.Deferred();
    var localURL = dataForm.cardurl;
    console.log(localURL);

    if (localURL == "") {
        $$.ajax({
            type: "POST",
            url: "upload.php",
            crossDomain: true,
            data: dataForm,
            success: function(data) {
                console.log("Upload to server without card");
                deferred.resolve();
            },
            error: function() {
                console.log("Form couldn't upload to the server");
                //alert("Couldnt upload to server, saving locally");
                deferred.reject();
            }
        });

    } else {
        //set upload options
        var options = new FileUploadOptions();

        options.chunkedMode = false;

        console.log("Start upload picture");

        var ft = new FileTransfer();
        ft.upload(deLokaleURL, encodeURI("uploaderino.php"), win, fail, options);

        function win(r) {
            console.log("Code = " + r.responseCode);
            console.log("R" + r.response);
            console.log("Sent = " + r.bytesSent);

            dataForm.cardurl = r.response;
            var dataString = JSON.stringify(dataForm);



            $$.ajax({
                type: "POST",
                url: "upload.php",
                crossDomain: true,
                data: dataForm,
                success: function(data) {
                    console.log("Upload to server with card");
                    deferred.resolve();
                },
                error: function() {
                    console.log("Form couldn't upload to the server, do nothing");
                    deferred.reject();

                }
            });



        }

        function fail(error) {
            //alert("An error has occurred: Code = " + error.code);
            console.log("An error has occurred: Code = " + error.code);
            console.log("upload error source " + error.source);
            console.log("upload error target " + error.target);


            showMessage("Image upload has failed, get a better internet connection and try again!", function() {
                console.log("Upload van de form is mislukt!")
            });
            deferred.reject();

        }
    }
    return deferred.promise();
}