Can't Get AJAX Success Message To Work

Question

Racking my brains for hours with this. I have the following PHP AJAX script:

<script type="text/javascript">
$(document).ready(function(){
$("#submitValue").click( function(){
    var uemail=$("#uemail").val();
    var uage=$("#uage").val();
    var city=$("#city").val();
    var urname=$("#urname").val();

    $.ajax({
        type: "POST",
        url:"acctUpdate.php",
        data: "uemail=" + uemail +"&uage="+ uage +"&city="+ city +"&urname="+urname +"&uname="+"<?php echo $memName; ?>" +"&uID="+"<?php echo $memID; ?>" +"&acctDB="+"profile" ,
        dataType: "dataString",
        success: function(data){
            $('#results').html('Success').delay(1000).fadeOut();
        }
    });
});
});
</script>

I am trying to get the message 'Success' to populate this span element;

<span id="results"></span>

But just can't seem to get it to work.

The PHP is as follows (the table is updated just fine);

if($_POST['acctDB'] == 'profile') {
$uemail = $DB->real_escape_string($_POST['uemail']);
$uage = $DB->real_escape_string($_POST['uage']);
$city = $DB->real_escape_string($_POST['city']);
$urname = $DB->real_escape_string($_POST['urname']);
$uname = $DB->real_escape_string($_POST['uname']);
$uID = $DB->real_escape_string($_POST['uID']);
mysqli_query($DB, 'UPDATE profile SET memEmail="'.$uemail.'", memAge="'.$uage.'", memCity="'.$city.'", memRealName="'.$urname.'" WHERE memID="'.$uID.'" AND memUname="'.$uname.'" ') or die(mysqli_error($DB));
}

Anyone be of assistance please?

Answer 1

Sorry but the code I have provider for you is for a Laravel framework and I suppose you are not using it. So you don't have the 'Respone::' class.

In the php file:

      //if the query has success 
        $return = array();

        $return['responseCode'] = 1;
        $return['responseHTML'] = 'Success'



        echo json_encode( $return );

And the ajax call:

$("#submitValue").click(function(e){
        var uemail=$("#uemail").val();
        var uage=$("#uage").val();
        var city=$("#city").val();
        var urname=$("#urname").val();
    $.ajax({
        url: 'acctUpdate.php',
        type: 'POST',
        dataType: 'json',
        data: "uemail=" + uemail +"&uage="+ uage +"&city="+ city +"&urname="+urname +"&uname="+"<?php echo $memName; ?>" +"&uID="+"<?php echo $memID; ?>" +"&acctDB="+"profile" ,

    })
    .done(function(response) {
        if( response.responseCode == 0 ) {
            //alert(respomse.responseHTML)
          $('#results').html(response.responseHTML);
        } else if( response.responseCode == 1 ) {
            //alert(res.responseHTML)
          $('#results').html(response.responseHTML);
        }

    })

    e.preventDefault();
})

So I don't use the response anymore but I will just return an array with the response.

Answer 2

dataType: "dataString"

Please comment this part and it will work.

if($_POST['acctDB'] == 'profile') {

$uemail = $DB->real_escape_string($_POST['uemail']);

$uage = $DB->real_escape_string($_POST['uage']);

$city = $DB->real_escape_string($_POST['city']);

$urname = $DB->real_escape_string($_POST['urname']);

$uname = $DB->real_escape_string($_POST['uname']);

$uID = $DB->real_escape_string($_POST['uID']);

mysqli_query($DB, 'UPDATE profile SET memEmail="'.$uemail.'", memAge="'.$uage.'", memCity="'.$city.'", memRealName="'.$urname.'" WHERE memID="'.$uID.'" AND memUname="'.$uname.'" ') or die(mysqli_error($DB));

echo 'yes';

}

// add echo 'yes'; at php submit page.

Answer 3

change the script as follows

$.ajax({
        type: "POST",
        url:"acctUpdate.php",
        data: "uemail=" + uemail +"&uage="+ uage +"&city="+ city +"&urname="+urname +"&uname="+"<?php echo $memName; ?>" +"&uID="+"<?php echo $memID; ?>" +"&acctDB="+"profile" ,
       // dataType: "dataString",
        dataType : "text",
        success: function(data){
            $('#results').html(data).delay(1000).fadeOut();
            return false;
        }
    });
 return false;

In php file change this

$qry = mysqli_query($DB, 'UPDATE profile SET memEmail="'.$uemail.'", memAge="'.$uage.'", memCity="'.$city.'", memRealName="'.$urname.'" WHERE memID="'.$uID.'" AND memUname="'.$uname.'" ') or die(mysqli_error($DB));

if($qry)
    echo "Success";
}

Answer 4

When you make an ajax call and you pass the values to a php file, you will also need to return the response.

So at the end of your query if everything is completed successful you will do something like this:

return Response::json(array(
            'success' => true,
            'message'  => trans('admin.update_success'),
        ), 200);

And your ajax cal looks something like this:

$("#submitValue").click(function(e){
        var uemail=$("#uemail").val();
        var uage=$("#uage").val();
        var city=$("#city").val();
        var urname=$("#urname").val();
    $.ajax({
        url: 'acctUpdate.php',
        type: 'POST',
        dataType: 'json',
        data: "uemail=" + uemail +"&uage="+ uage +"&city="+ city +"&urname="+urname +"&uname="+"<?php echo $memName; ?>" +"&uID="+"<?php echo $memID; ?>" +"&acctDB="+"profile" ,
        dataType: "dataString",
    })
    .done(function(response) {
        alert(response.message)

    })
    .fail(function(response) {
        if (response.status == 400) {
            var output = '<ul>';
            var errors = $.parseJSON(response.responseText).errors;
            $.each(errors, function(id, message) {
                output += '<li>' + message[0] + '</li>'
            });
            output += '</ul>'
            alert(output)
        } else {
        alert('UnknownError');
        }
    })
    e.preventDefault();
})

So to recap:

You make the ajax call The php file will process the data You pass the response back to the 'done function) And hier you can make anything you want with your response.

I have just as example inserted an alert message

Hope this helps.