Ajax Success and Error function failure

Question

I am having trouble getting my jQuery ajax to work properly. It directs to the PHP page to update the database, but never returns back to the script for the success or error options.

My code is below:

$(document).ready(function(){  
        $("form#updatejob").submit(function() {  
            function textreplace(x) {return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");}
            // we want to store the values from the form input box, then send via ajax below
            var job     = $("#job").attr("value");
            var description     = $("#description").val();
            description.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
            var startDate   = $("#startDate").attr("value");
            var releaseDate = $("#releaseDate").attr("value");  
            var status  = $("#status").attr("value"); 
            $.ajax({
                beforeSend:textreplace(description),
                type: "POST",  
                url: "updatedjob.php",
                data: "jobID="+ job +"& description="+ description +"& startDate="+ startDate +"& releaseDate="+ releaseDate +"& status="+ status, 
                success: function(){  
                    $("form#updatejob").hide(function(){$("div.success").fadeIn();});  
                },
                error: function(XMLHttpRequest, textStatus, errorThrown) { 
                    alert("Status: " + textStatus); alert("Error: " + errorThrown); 
                }       
            });
            return false;  
        });  
});

And the PHP:

<?php 
    include("connect.php"); 
    $job = trim($_POST['job']); 
    $startDate = trim($_POST['startDate']); 
    $releaseDate = trim($_POST['releaseDate']); 
    $mysqlstartdate = date('Y-m-d', strtotime($startDate)); 
    $mysqlreleasedate = date('Y-m-d', strtotime($releaseDate)); 
    $description = trim($_POST['description']); 
    $status = trim($_POST['status']); 
    $update = "UPDATE jobs SET startDate = '$mysqlstartdate', releaseDate = '$mysqlreleasedate', description = '$description', status = '$status' WHERE jobID = '$job' "; 
    $rsUpdate = mysql_query($update);
// or die(mysql_error()); mysql_close(); 
?>

What happens if you put an `alert()` in the first line of the `success` callback function? `success: function(){ alert('foobar');...` — Jasper, Jan 18 '12 at 22:14
It would seem logical that you provide the php code as well. Are you echoing a response? — Kai Qing, Jan 18 '12 at 22:18
Jasper: My success never runs because the PHP page never returns to the javascript. — michael, Jan 19 '12 at 16:50
You would have gotten an answer quicker had you put the php in the question (and formatted legibly) — Justin Kyle Parton, Aug 06 '14 at 01:14

score 109 · Answer 1 · answered Jan 18 '12 at 22:15

Try this:

$.ajax({
    beforeSend: function() { textreplace(description); },
    type: "POST",  
    url: "updatedjob.php",
    data: "jobID="+ job +"& description="+ description +"& startDate="+ startDate +"& releaseDate="+ releaseDate +"& status="+ status, 
    success: function(){  
        $("form#updatejob").hide(function(){$("div.success").fadeIn();});  
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) { 
        alert("Status: " + textStatus); alert("Error: " + errorThrown); 
    }       
});

The beforeSend property is set to function() { textreplace(description); } instead of textreplace(description). The beforeSend property needs a function.

I changed that part, but it still does not return to the function. Thank you for the attempt. — michael, Jan 19 '12 at 16:36

score 16 · Answer 2 · answered Aug 11 '15 at 00:31

One also may use the following to catch the errors:

$.ajax({
    url: url, 
    success: function (data) {
        // Handle success here
        $('#editor-content-container').html(data);
        $('#editor-container').modal('show');
    },
    cache: false
}).fail(function (jqXHR, textStatus, error) {
    // Handle error here
    $('#editor-content-container').html(jqXHR.responseText);
    $('#editor-container').modal('show');
});

score 6 · Answer 3 · answered Sep 24 '15 at 13:58

6

I was having the same issue and fixed it by simply adding a dataType = "text" line to my ajax call. Make the dataType match the response you expect to get back from the server (your "insert successful" or "something went wrong" error message).

answered Sep 24 '15 at 13:58

Stacy Drennan

63
1
3

score 4 · Answer 4 · edited Jun 23 '14 at 03:23

4

You can implement error-specific logic as follows:

error: function (XMLHttpRequest, textStatus, errorThrown) {
    if (textStatus == 'Unauthorized') {
        alert('custom message. Error: ' + errorThrown);
    } else {
        alert('custom message. Error: ' + errorThrown);
    }
}

edited Jun 23 '14 at 03:23

user664833

18,397
19
91
140

answered Jul 09 '13 at 13:12

Mian

231
5
7

score 3 · Answer 5 · edited Aug 06 '14 at 00:39

3

This may be an old post but I realized there is nothing to be returned from the php and your success function does not have input like as follows, success:function(e){}. I hope that helps you.

edited Aug 06 '14 at 00:39

DF_

3,743
25
34

answered Aug 06 '14 at 00:13

Robert Greene

151
1
5

score 0 · Answer 6 · answered Apr 04 '13 at 23:33

This may not solve all of your problems, but the variable you are using inside your function (text) is not the same as the parameter you are passing in (x).

Changing:

function textreplace(x) {
    return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
}

To:

function textreplace(text) {
    return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
}

seems like it would do some good.

score 0 · Answer 7 · edited Jan 15 '16 at 12:18

0

You are sending a post type with data implemented for a get. your form must be the following:

$.ajax({
url: url,
method: "POST",
data: {data1:"data1",data2:"data2"},
...

edited Jan 15 '16 at 12:18

Plamen G

4,729
4
33
44

answered Jan 15 '16 at 12:06

user3214937

1

score 0 · Answer 8 · edited Jan 22 '21 at 18:19

 $.ajax({
         type:'POST',
         url: 'ajaxRequest.php',
         data:{
         userEmail : userEmail
         },
         success:function(data){
         if(data == "error"){
                $('#ShowError').show().text("Email dosen't Match ");
                $('#ShowSuccess').hide();
               }
               else{
                 $('#ShowSuccess').show().text(data);
                }
              }
            });

Ajax Success and Error function failure

8 Answers8

Linked