在$ .when()未执行之后,在.done(function())中使用Jquery ajax代码

时间:2014-05-28 11:04:19

标签: javascript jquery ajax

这是问题的jquery代码。我想让ajax将json数据发送到服务器然后提交表单。如果我没有when和done子句,则可以在ajax之前完成提交,并且无法及时检索成功或错误。

 function deleteImage(button)
    {
        //There is only one image that is a sibling of the delete button
        var image = $(button).siblings(".MultiFile-image")[0];
        var groupId = $(image).data("modelId");
        var imgId = $(image).data("id");
        var imgSrc = $(image).attr("src");

    //Delete the image view after the removed button is clicked but the data to be sent to the server for deletion is already stored
    $(button).parent(".MultiFile-label").remove();


    var imageToDelete = {imgId:imgId, imgSrc:imgSrc, groupId:groupId};
    var imageJSON =  '{"imageToDelete":' + JSON.stringify(imageToDelete) + "}";
    //This is needed to check whether ajax has been executed before submission
    var sentImageData = false;
    $("form").submit(function(e) {
        //Stop submission, need to send data through ajax first, will submit after ajax is executed later.
        if(!sentImageData)
        {
            e.preventDefault();
    //Send the images for deletion only when the form has been submitted
    //For some reason this code is never executed and go immediately to the end of this method

 $.when(sendImageData(imageJSON)).done(function(jqXHR) {
                if(jqXHR.readyState == 4 && jqXHR.status == 200)
                {
                    sentImageData = true;
                    $("form").submit();
                }
                else
                {
                    console.log(jqXHR);
                    sentImageData = false;
                }
            }); //For some reason the debugger skips to here and return is undefined

            }
            //If executed is true, send the form as normal
        });
}
/**
 * @var imageJSON the image json data that will be sent to the server to delete the image
 * @returns {@exp;$@call;ajax} return XMLHttpRequest of the ajax
 */
function sendImageData(imageJSON)
{
   return $.ajax({
            type: 'POST',
            data: imageJSON,
            dataType: 'JSON',
            url: "index.php?r=artworkGroup/deleteArtwork",
        });
}

谢谢,我非常感谢社区对此问题的帮助:)

编辑:以下是处理此ajax代码的操作。 json的一个例子是:“{”imageToDelete“:{”imgId“:2,”imgSrc“:”upload_file / artwork / 1-New_Artwork_Group / 12861274.jpg“,”groupId“:2}}”

  public function actionDeleteArtwork() {
            $noError = false;           
            if(isset($_POST["imageToDelete"]))
            {
                $imageArray = $_POST["imageToDelete"];
                //Delete every image retrieved by post
                foreach($imageArray as $image)
                {
                    $transaction = Yii::app()->db->beginTransaction();
                    try{
                        $imageToDelete = json_decode($image);
                        $model = $this->loadModel($imageToDelete->groupId);
                        $artworkToDelete = $model->artworks->loadModel($imageToDelete->id);
                        if($imageToDelete->imgSrc == $artworkToDelete->imgSrc)
                        {
                            $artworkToDelete->delete();                    
                            if(file_exists($imageToDelete->imgSrc))
                            {
                                unlink($imgToDelete->imgSrc);
                            }
                        }    
                        else
                        {
                            $hasError = true;
                        }   
                        $transaction->commit();
                    }
                    catch(Exception $e)
                    {
                        $transaction->rollback();
                        $hasError = true;
                    }
                    //Delete the image files if there are no errors and that the file exists, otherwise just ignore 
                    if(file_exists($imageToDelete->imgSrc) && $noError)
                    {
                        unlink($imageToDelete->imgSrc);
                    }
                }
            }
       }

1 个答案:

答案 0 :(得分:0)

您已从ajax请求中省略 url 。这意味着它将击中您当前的页面网址。这可能会触发超时。

超时是$ .ajax中的一种错误。这就是为什么你的

  

sendImageData(imageJSON)

让你失意。由此导致你的.done()没有被执行。