CODEWITHSUNDEEP
phpjavascriptjqueryresponse
input
input

Reputation: 7519

Conditional statements based on PHP response via jQuery

My form is returning data from PHP via jQuery. How can I create conditional statements based on the response in jQuery.

This is the jQuery:

  $.ajax({
                    type: "POST",
                    url: "createAlbum.php",
                    data: postData, 
                    success: function(data){
                        $('#message').fadeIn();
                        $('#message').html(data);
                    }
                  });

This is what it is returning from PHP:

if($error) {
        echo $error;
    }
    else {
        echo $success;
    }

So if the response is success, the message should hide after a few seconds, but if it is an error, it should wait till the user corrects it. Something like this:

success: function(data){
                    $('#message').fadeIn();
                    $('#message').html(data);

                    if (data.response == 'success') {
                        alert('Success');
                        setTimeout(function() {
                            $('#message').fadeOut();
                            }, 5000 );
                    } else if (data.response == 'error') {
                            alert('Error');
                       }
            }

Upvotes: 2

Views: 2026

Answers (3)

AJ.
AJ.

Reputation: 28174

Why don't you use the statusCode setting for your call to ajax() and have even more fine-grained control than just "success" and "error"? There are (or will be) many different ways your script could succeed or fail.

statusCode(added 1.5)Map Default: {}

A map of numeric HTTP codes and functions to be called when the response has the corresponding code. For example, the following will alert when the response status is a 404:

$.ajax({ statusCode: { 404: function() { alert('page not found'); } } });If the request is successful, the status code functions take the same parameters as the success callback; if it results in an error, they take the same parameters as the error callback.

UPDATE:

I've added an example of how to use statusCode instead of success and error settings for ajax() call in Jquery. First, the test UI:

<html>
<head>
<title>jQuery Test Page</title>
<script type="text/javascript" src="jquery-1.6.js"></script>
<script type="text/javascript">
function displayMessage(message){
    $('#message').fadeIn();
    $('#message').html(message);
}

function successFunction(data){
    displayMessage(data);
}

function notFoundFunction(){
    displayMessage("Not Found!");
}

function errorFunction(){
    displayMessage("An Error Occurred!");
}

function invokeAjax(test){
    $.ajax({
        type: "POST",
        url: "test.php?test="+test,
        //data: postData,
        statusCode: {
            200: successFunction,
            404: notFoundFunction,
            500: errorFunction,
        }
    });
}
</script>
</head>

<body>
<h1 id="message" style="display:none;"></h1>
<a href="javascript:invokeAjax('success');">Invoke Ajax - Success (200)</a><br>
<a href="javascript:invokeAjax('notfound');">Invoke Ajax - Not Found (404)</a><br>
<a href="javascript:invokeAjax('error');">Invoke Ajax - Error (500)</a><br>
</body>
</html>

And here's the PHP script called by the Ajax:

<?php

$test = $_GET['test'];

if($test == 'success'){
    echo 'some meaningful data';
} else if($test == 'notfound') {
    http_send_status(404);
} else if($test == 'error'){
    http_send_status(500);
}
?>

I think it's pretty self-explanatory, but if you have any further questions, don't hesitate to ask.

Upvotes: 3

input
input

Reputation: 7519

Thank you for your helpful answers. I solved it using JSON though!

PHP:

if($error) {

        echo json_encode(array('success' => false, 'text' => $error));
    }
    else {

        echo json_encode(array('success' => true, 'text' => $success));
    }

jQuery:

if (data.success) {
            alert('Success');
            setTimeout(function() {
                $('#message').fadeOut();
            }, 5000 );
    } else {
        alert('Error ' + data.text);
    }

Upvotes: 0

munti
munti

Reputation: 1

Of course, to get AJ's solution to work, you need to respond from the server to the client with the correct headers - http://no.php.net/manual/en/function.header.php:

header('HTTP/1.1 404 Not Found');

or

header('HTTP/1.1 500 Internal Server Error');

Here is a list of HTTP codes: http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html

Hope this helps :)

Upvotes: 0

Related Questions