user3759502
user3759502

Reputation: 21

ajax post with PHP

why isn't this working?

jQuery AJAX Code:

$("header input").bind("keyup", function()
{
    var searchString= $("header input").val();
    var dataString = 'search=' + searchString;
    alert(dataString);
    $.ajax({
        type: "POST",
        url: "index.php",
        data: dataString,
        cache: false
    });
});

PHP Code(Just a test Code):

if($_POST["search"]) {
    echo "TEST MESSAGE!";
}

It doesn't show The echo :/

thanks for ur help ;)

Upvotes: 0

Views: 93

Answers (5)

where is your call back function in $.ajax() function,with callback function only,you can display anything through an ajax request..

So try this.

$("header input").on("keyup", function () {
    var searchString = $("header input").val();
    var dataString = 'search=' + searchString;
    alert(dataString);
    $.ajax({
        type: "POST",
        url: "index.php",
        data: dataString,
        cache: false,
        success: function (data) {
            $('#Yourdiv').html(data);  // or $('#Yourdiv')text(data);
        }
    });
});

Without success function,you can see the echoed statement in your network segment in console.

for that, press F12,then you will get a link like XHR finished loading: POST "http://localhost/yourproject/func_name.Click on that link and you will goto network segment and from there,click on the function name and then in response or preview tab,you canb see the echoed statement.. try it.

Upvotes: 0

Gurunatha Dogi
Gurunatha Dogi

Reputation: 341

Hopes this will help you....

$("header input").bind("keyup", function()
{
    var searchString= $("header input").val();
    var dataString = 'search=' + searchString;
    alert(dataString);
    $.ajax({
        type: "POST",
        url: "index.php",
        data: dataString,
        cache: false,
        async: false
    },success: function (data) {


     $('div#posteddata').append(data);

    }

);
});


<html>
<head>

</head>

<body>

<div id="posteddata"></div>

</body>

</html>

Upvotes: 1

biswajitGhosh
biswajitGhosh

Reputation: 147

Try with this

In js add

success: function (data) {
        // success handler
    }

as your response handler

if($_POST["data"]) {
  // search = search string available here  in $_POST['data']
  echo "TEST MESSAGE!";
}

Upvotes: 0

JKurcik
JKurcik

Reputation: 230

You need to specify an element you want to update.. for example

<div id="result"> </div>

and then append a success event handler to your ajax call

        $("header input").bind("keyup", function () {
            var searchString = $("header input").val();
            var dataString = 'search=' + searchString;
            alert(dataString);
            $.ajax({
                type: "POST",
                url: "index.php",
                data: dataString,
                cache: false
            }).success(function (data) {
                $("#result").html(data);
            }).fail(function () {
                alert("Ajax failed!");
            });
        });

Upvotes: 0

Sridhar R
Sridhar R

Reputation: 20408

You need to display the data you receive from the ajax call. Example, to put the result into a <div> called YourresultDiv:

Try with this

$("header input").on("keyup", function () {
    var searchString = $("header input").val();
    var dataString = 'search=' + searchString;
    alert(dataString);
    $.ajax({
        type: "POST",
        url: "index.php",
        data: dataString,
        cache: false,
        success: function (data) {
            $('#YourresultDiv').html(data);
            alert("Successful");
        }
    });
});

Upvotes: 1

Related Questions