Ajax Response is giving data success error

Question

I am new to Ajax and want toperform some database interaction using AJAX in JQUERY by linking to PHP script.

        $(function() {  
          $.ajax({

                type: "POST",

                url: "response.php",
                data: {name:"amol"},
                success: function (data) {
                if (data.Success) {
                    alert('Success! We have data.Success!');
                 } else {
                    alert('Error! We do not have data.Success!');
                }
            },
            error: function(jqXHR, textStatus) {
                alert('Error: ' + textStatus);
            }          
             });

        });

My response.php file does not contain much. The code in it is:

        <?php
         echo "Hello";
         ?>

I want to use this code for database interaction. But when I run this much of code , I get output as 'Error!we dono have data.Success!

Also, I want to know ,How to output variables from the php script on succesful response?

Thanks in advance for help !!

Answer 1

success: function(data) {
    alert('Success! We have data - Success!');
}

Will work as expected.

What you are doing is asking if you have a data object with a Success item with the line

if (data.Success) {

data is just a string so this evaluates to false .

The success: function(data) { part already only occurs if you have successfully returned data

You then can use the data by adding that data to a div, alert or whatever as

 success: function(data) {
    alert(data);
}

You are returning exactly what is expected as the data variable does not have a Success item - instead you are returning a string (think $string = "hello" - data = $string in effect!)

Answer 2

try this code...

$.post("response.php", {name:"anmol"},function(data){
alert(data);
});

in your above code this..

<?php
         echo "Hello";
         ?>

here you pass string so simply you can use..

if you want to pass array of value so you can use like this

<?php
$data=array(
"name":"anmol",
"age":"21",
);

echo json_encode($data);
         ?>

    $.post("response.php", {name:"anmol"},function(data){
var json = $.parseJSON(data);
    alert(json.name);
    alert(json.age);
    });

here you only get alert when the function is success, in fail of function you can not get any response

Answer 3

This works (I just tested) with your JavaScript code:

<?php

$json_response = array();
$json_response['Success'] = true;

header('Content-Type: application/json');
echo json_encode($json_response);

?>

The problem was that you weren't responding with a JSON object (which is a data-interchange format).

Answer 4

The first comment in your post is right, as well as Graham Ritchie's explanation; also, you should check the examples in jQuery AJAX documentation .

Additionally, you should consider done and fail , instead of success and error , as they are getting considered deprecated in newer versions of jQuery. They are only a little more advanced, but more powerful.

Here's a general example:

    $(function() {  
      $.ajax({
        type: "POST",
        url: "response.php",
        data: {name:"amol"}
      })
      .done(function(data) {
        // What you want to do in case of success 
        // 'data' is going to be what the URL gives you. i.e.: HTML, JSON
        // You could append the HTML to a DIV or use the JSON in some way
      })
      .fail(function(jqXHR, textStatus) {
        // What you want to do in case of error
      });
    });

I recommend you to check this tutorial , especially the last chapter on AJAX and Deferred.

Answer 5

if u are new to ajax . i suggest you start using this shit

$.ajax({
        url: 'response.php',
        type: 'POST',
        dataType: 'json',
        data: {name: 'amol'},
    })
    .done(function(data) {
        if (data.Success) {
                    alert('Success! We have data.Success!');
                 } else {
                    alert('Error! We do not have data.Success!');
                }
        console.log("success");
    })
    .fail(function() {
        console.log("error");
    })
    .always(function() {
        console.log("complete");
    });