CODEWITHSUNDEEP
javascriptphpjqueryajaxpdo
Rien
Rien

Reputation: 458

PHP Ajax not creating post variable

A while ago i made a search function with ajax and php. You could fill in a textbox with text and it would try to find a match among all countries stored in the database. Now i am refining the code and making it PDO, but i broke something and i cant find out what.

this is my plain HTML

<head>
    <title>Ajax</title>
    <link href="style/style.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript" src="scripts/Javascript.js"></script>
</head>

<body>
    <div id="main">
            <h1 class="title">Enter your country please</h1>

        <input type="text" id="search" autocomplete="off" onchange="">
            <h4 id="results-text">Showing results for: <b id="search-string">Array</b></h4>

        <ul id="results"></ul>
    </div>
</body>

here is my Jquery and javascript. note i have not changed anything to the HTML nor javascript so it can not by a type error.

$(document).ready(function() {
alert('asdf');

function search() {
    var query_value = $('input#search').val();
    $('b#search-string').html(query_value);

    if(query_value !== ''){
        $.ajax({
            type: "POST",
            url: "search.php",
            data: { query: query_value },
            cache: false,
            success: function(html){
                $("ul#results").html(html);
            }
        });
    }

    return false;
}

$("input#search").live("keyup", function(e) {
    clearTimeout($.data(this, 'timer'));
    var search_string = $(this).val();

    if (search_string == '') {
        $("ul#results").fadeOut();
        $('h4#results-text').fadeOut();
    }

    else {
        $("ul#results").fadeIn();
        $('h4#results-text').fadeIn();
        $(this).data('timer', setTimeout(search, 100));
        };
    });
});

And here is my Search.PHP

<?php
class SearchEngine{

    private $html;

    public function __construct($conn){

        $this->html = '<li class="result">
                            <h3>NameReplace</h3>
                            <a target="_blank" href="ULRReplace"></a>
                        </li>';

        if (isset($_POST["query"])) {
            $search_string = $_POST['query'];
        }

        else{
            $search_string = '';
            echo('Something went wrong, post query not set');
        }


        //$search_string = mysql_real_escape_string($search_string);

        if (strlen($search_string) >= 1 && $search_string !== ' ') {

            $query = 'SELECT * FROM country WHERE name LIKE "%' . $search_string . '%"';
            $result = $conn->prepare($query);
            $result->execute();
            $result_array = $result->fetchAll();

                foreach ($result_array as $result) {
                    $display_name = preg_replace("/" . $search_string . "/i", "<b>" . $search_string . "</b>", $result['name']);
                    $display_url = 'sadf';

                    $output = str_replace('NameReplace', $display_name, $this->html);
                    $output = str_replace('ULRReplace', $display_url, $output);
                    echo($output);
                }
        }
    }

}

?>

The problem:

the Post query is never created, for this i made a isset so for now when there is no Post Query created. It will create a Post Query with value "B".

Any help will be much appreciated. Please be gentle i am new to Ajax and i rather want to understand than have the solution. Thank you

Upvotes: 0

Views: 158

Answers (2)

Jonathan Simas
Jonathan Simas

Reputation: 320

You're not point the right URL! Look:

You have pointed your ajax request to search.php :

 $.ajax({
        type: "POST",
        url: "search.php",

But you have just a class in search.php. A class don't do anything by itself. You have to Instantiate and call its methods/functions. Please compare these 2 pieces of code:

<?php
//server.php
//Doing nothing
class SearchEngine{

    private $html;

    public function __construct($conn){
     echo "I'm executing";
    }
}
?>

let's say you have this in server.php

<?php
//server.php
//It will print "I'm executing" in the screen
class SearchEngine{

    private $html;

    public function __construct($conn){
     echo "I'm executing";
    }
}

$search = new SearchEngine($conn);

?>

To solve your original problem You have to to point your ajax to the page having the INSTANTIATION code, not the class, like this:

//index.php
//Let's suppose you have this code in your index.php
$SearchEngine = new SearchEngine($conn);

So your JQuery ajax code should looks like that:

    $.ajax({
        type: "POST",
        url: "index.php",

Upvotes: 1

RedactedProfile
RedactedProfile

Reputation: 2808

As Mentioned by Sean, in the comments, the $.live jquery method is deprecated in your version of jQuery.

Try utilizing $.keyup instead

$("input#search").keyup(function() {
   // stuff
});

Upvotes: 1

Related Questions