JQuery ui autocomplete with php (codeigniter) and database

Question

I have this ac.php file and this result.php file I want to use the autocomplete in JQuery UI in the ac.php file, but I want it to retrieve the data from result.php as a source. I just dont know how to do it. I tried this way, but its not working

ac.php

<html>
<head>
    <link type="text/css" href="jqui/css/ui-lightness/jquery-ui-1.8.11.custom.css" rel="stylesheet" />  
    <script type="text/javascript" src="jqui/js/jquery-1.5.1.min.js"></script>
    <script type="text/javascript" src="jqui/js/jquery-ui-1.8.11.custom.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
        $("#tags").autocomplete("result.php");
    });

  </script>
</head>
<body>

<div class="ui-widget">
    <label for="tags">Tags: </label>
    <input id="tags">
</div>

</body>
</html>

this is result.php

<?php
$arrResults = array('option 1', 'option 2', 'option 3');

// Print them out, one per line
echo implode("\n", $arrResults); 

?>

try returning it as a jsonstring json_encode($arrResults). Also, have you checked on firbug to see whether the request/response is ok? — JohnP
– JohnP, Commented Apr 1, 2011 at 11:17
This is just the code you were given from here - are you asking how to integrate this with codeigniter specifically? — Ross
– Ross, Commented Apr 1, 2011 at 11:19
@Ross no, I can do it with codeigniter. The problem is when I used JQuery UI. its not retrieving the sample information — Kay
– Kay, Commented Apr 1, 2011 at 11:30
Hello, the error console of FireFox printed an error message. According of the documentation the method '.autocomplete()' needs the data in form of JSON. — Reporter
– Reporter, Commented Apr 1, 2011 at 11:37

Community · Accepted Answer · 2023-11-17 19:42:58Z

3

Quoting the documentation of Autocomplete :

the Autocomplete plugin expects that string to point to a URL resource that will return JSON data.

So, instead of your code, you should use something like this :

<?php
$arrResults = array('option 1', 'option 2', 'option 3');
echo json_encode($arrResults);
?>

The [**`json_encode()`**][2] function will return the JSON string that corresponds to your array.

edited Nov 17, 2023 at 19:42

CommunityBot

11 silver badge

answered Apr 1, 2011 at 11:19

Pascal MARTIN

402k82 gold badges665 silver badges666 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Kay Over a year ago

I hope your still around :p .. I did exactly what you said and it worked. But I noticed something. Whatever i write the bar displays all words in the array. It doesnt comply what what the user enters.

Timon. Z · Accepted Answer · 2011-04-01 11:28:25Z

1

ac.php

$(function() {
    $( "#tags" ).autocomplete({
        source: "result.php",
        dataType:'json',
        minLength: 0,
        delay:0

    });

    $( "#tags" ).click(function() {
        $( "#tags" ).autocomplete("search","");
    });
});

result.php

<?php
$arrResults = array('option 1', 'option 2', 'option 3');

// Print them out, one per line
echo json_encode($arrResults);
?>

answered Apr 1, 2011 at 11:28

Timon. Z

6813 silver badges10 bronze badges

2 Comments

Kay Over a year ago

I tried your way, but it didnt work :( + I dont understand the the second function, why use it?

Timon. Z Over a year ago

The second function allows you to "autocomplete" on click and not only when you type something in the input.

Collectives™ on Stack Overflow

JQuery ui autocomplete with php (codeigniter) and database

2 Answers 2

1 Comment

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related