CODEWITHSUNDEEP
phpajaxautocomplete
yiannis
yiannis

Reputation: 430

ajax autocomplete from array

i'm trying to create a simple autocomplete textbox that takes the suggestions from an array.the code i'm using(based on this) is :

call.php

<?php
$list = array(
    "Autocomplete",
    "Metapher",
    "Metatag");

for($i=0; $i<count($list); $i++){
    if(strpos($list[$i], $_GET['str']) !== FALSE && strlen($_GET['str']) >= 2){
        echo str_ireplace($_GET['str'], '<b style="color:   red;">'.$_GET['str'].'</b>', $list[$i]) . '<br>';
    }
}

?>

index.php

<!DOCTYPE html>
<html>
    <head>
        <title>AJAX - 03</title>
        <script type="text/javascript">
            var ajax = new XMLHttpRequest;

            function t(){           
                ajax.open("GET", "call.php?str=" + document.getElementById("test").value, false);
                ajax.send();

        ajax.onreadystatechange=function()
        {
          if (ajax.readyState==4 && ajax.status==200)
          {
                document.getElementById("container").innerHTML = ajax.responseText;
          }
       }
    }

        </script>
    </head>

<body>
    <div id="container" style="border: 3px; border-style: solid; font-size: 42pt; border-radius: 7px;">
    Text
    </div>

    <br><br>
    <input id="test" type="text" onkeyup="javascript:t()">
</body>
</html>

but nothing comes up at the suggestion box.I can't find any syntax errors so i suppose there is something wrong with the logic?

UPDATE: after the advice from PLB and FAngel i added the onreadystatechange and the checks.However it still doesn;t work properly.Actually i just found that if you type a compination of letters that are inside one of the 3 words the suggestions come up properly.It just doesnt work if you type the starting letters of a word.For example if i give "com" as input the word Autocomplete comes up.However if i give "Aut" then nothing.So i guess the actual problem is here: 

if(**strpos($list[$i], $_GET['str']) !== FALSE** && strlen($_GET['str']) >= 2)

From what i read here http://php.net/manual/en/function.strpos.php the problem could be the use of != but i use !== as i should.Any thoughts?

Upvotes: 2

Views: 4188

Answers (3)

Rajat Modi
Rajat Modi

Reputation: 1343

You can also work it like this.

http://jsfiddle.net/qz29K/

All you need is you just replace the json array with php jsonencoding like this 

$list = array(
"Autocomplete",
"Metapher",
"Metatag");

<script>
var availableTags = <?php echo json_encode($list) ?>
</script>

Hope this will help.

Upvotes: 2

Keval Domadia
Keval Domadia

Reputation: 4763

It totally WORKS!

I tried it.

I had input : Met

and it gave me Metaphor and one more word.

However, for advanced usage. Check this out, you gonna love it.

http://jqueryui.com/demos/autocomplete/

Upvotes: 1

Viktor S.
Viktor S.

Reputation: 12815

You are missing that your request is asynchronous. So when you run this line: document.getElementById("container").innerHTML = ajax.responseText;, request is not done yet. Take a look at this . onreadystatechange is what you need. Or make that call synchronous

Upvotes: 2

Related Questions