Can't select suggestions when I click on them

Question

I can't select any suggestions when I click on them.

I want the suggestions can be clicked, selected and changed color when I hover on them.

How can I do this?

This is my current code:

<?php
    include 'connect.php'; //connect with database
    $query = $_GET["q"];
    if($query != "")
    {
        $safequery = mysqli_real_escape_string($con,$query);
        $stmt = "SELECT * FROM searchengine WHERE title LIKE '%" . $safequery . "%' OR keywords LIKE '%" . $safequery . "%' OR link LIKE '%" . $safequery . "%' LIMIT 4";
        $result = mysqli_query($con,$stmt) or die(mysqli_error($con));

        $number_of_result = mysqli_num_rows($result);
        if ($number_of_result > 0)
        {
            //results found here and display them
            while ($row = \mysqli_fetch_assoc($result))
            { //show first 10 results
                //add $title to an array which you will call json_encode(arr) on.
                $title = $row["title"];
                echo "<div id='sugg-search-result'>";
                echo "<div id='sugg-title'>" . $title . "</div>";
                echo "</div>";
            }
        }
    }
?>

For the effect on mouse Hover you can think about making some css to the sugg-title css class. — Goikiu, Jan 03 '14 at 14:06
See for example jQuery's Autocomplete: http://jqueryui.com/autocomplete/ and it's related stylesheet. You need to do styling with CSS like Goikiu pointed out. You can do it all manually or just use some readymade solution like Autocomplete or AutoSuggest (http://code.drewwilson.com/entry/autosuggest-jquery-plugin) wich provide the necessary classes and styles automatically. — ZZ-bb, Jan 03 '14 at 14:17

score -1 · Answer 1 · answered Jan 03 '14 at 14:13

You can try like below:

<?php

include 'connect.php'; //connect with database

$query = isset($_GET["q"]) ? $_GET : '' ;

if($query != "")
{
    $safequery = mysqli_real_escape_string($con,$query);

    $stmt = "SELECT * FROM searchengine WHERE title LIKE '%" . $safequery . "%' OR keywords LIKE '%" . $safequery . "%' OR link LIKE '%" . $safequery . "%' LIMIT 4";

    $result = mysqli_query($con,$stmt) or die(mysqli_error($con));

    $number_of_result = mysqli_num_rows($result);

    if ($number_of_result > 0) {
        //results found here and display them
        while ($row = \mysqli_fetch_assoc($result)) { //show first 10 results
            //add $title to an array which you will call json_encode(arr) on.
            $title = $row["title"];
            echo "<div id='sugg-search-result'>";
            echo "<div class='suggestion' id='sugg-title'>" . $title . "</div>";
            echo "</div>";

        }

    }
}
?>

CSS:

<style>
    .suggestion:hover {
        color:orange;
    }
</style>

Javascript:

<!-- jQuery -->

<script>
    $(document).on('click','.suggestion',function(){
        // write your necessary javascript code
    });
</script>

Can't select suggestions when I click on them

1 Answers1